18
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

slick.jsでjavascriptの読み込みが終わるまで縦並びになってしまう。

Last updated at Posted at 2016-03-01

タイトルみたいなことが起こってしまって、たくさんの画像で画面が埋まってしまってました。

とりあえず簡単な解決方法

<div class="your-class">
  <div>your content</div>
  <div>your content</div>
  <div>your content</div>
</div>

これを

<div class="your-class">
  <div class="slick-slide">your content</div>
  <div class="slick-slide">your content</div>
  <div class="slick-slide">your content</div>
</div>

みたいに**slick-slideをつけてあげる**と、とりあえず縦並びになるのを防げます。

もし読み込みが遅くて画像が縦並びになってしまうといった現象に、こういった対応をしてみてはいかがでしょうか。


追記(2018.07.09)

この方法にバグが見つかりました。
asNavForを使って連携させるとき挙動がおかしくなります。
ですので、その際はクラス名slick-slideを使わない対応をしてください。

詳しくはこちらの記事で ( https://qiita.com/yoshiiiiie/items/2deaf0d3b7d8271d6e38 )

18
12
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
18
12

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?