- このトピックには6件の返信、2人の参加者があり、最後に
により3年、 4ヶ月前に更新されました。
-
投稿
-
【お使いの Snow Monkey のバージョン】14.3.5
【お使いの Snow Monkey Blocks のバージョン】11.4.1
【お使いの Snow Monkey Editor のバージョン】5.0.6
【お使いのブラウザ】Chrome
【当該サイトのURL】https://ichiryuono.co.jp/### 実現したいこと
スライダー読み込みの際に現れる空白？をなくしたい
### 発生している問題
メインビジュアルにスライダーを使っていますが
読み込みの度に余白？空白？が出てきます。
これの挙動をなくしたいです。
見ていただくほうが早いと思いますので以下動画をご確認ください。### 試したこと
「遅延」「スペース」などでググっても解決方法がわからず。
フォーラムでも確認しましたが、解決に至りません。すでに公開されていて、お客様からはなにも言われていませんが
アクセスのたびに気になりますので、直したいです…わかるかたいましたら、ご教示くださいませ。
いいねをした人: 居ませんたしかに気になりますねぇ。なおしたいですね！
こちらで似たようなスライダー構成（PC用スライダーブロック→スマホ用スライダーブロック）で試してみましたが、“素”のSnow Monkeyだと、同じ症状は確認できませんでした。らぶせれさんは、画像関連のプラグインや遅延読み込みの設定などは使用されてますか？
PC用スライダー・1枚目の画像あたりのソースコード、私が試したものと異なってました。らぶせれさん
<div class="smb-spider-slider__figure-wrapper"> <img class="spider__figure lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="一竜小野スタイル" data-image-id="132" data-src="https://ichiryuono.co.jp/wp-content/uploads/ss01-1.jpg" /> <noscript> <img class="spider__figure" src="https://ichiryuono.co.jp/wp-content/uploads/ss01-1.jpg" alt="一竜小野スタイル" data-image-id="132" data-eio="l" /> </noscript> </div>わたし（ドメイン部分は変更してます）
<div class="smb-spider-slider__figure-wrapper"> <img class="spider__figure" src="https://example.com/snowmonkey/wp-content/uploads/2021/06/kaitlyn-baker-vZJdYl5JVXY-unsplash.jpg" alt="" data-image-id="381"/> </div>もしかしたらですが、
lazyloadのクラス名がついたimgタグにあるインラインイメージ（gif）が一瞬表示されているとか？そのあたりが怪しいと踏んでますが、検証しきれないため、使用されているプラグインリスト、【カスタマイズ】の設定などもご提示いただいたほうが解決策が見いだせるかもしれません。いいねをした人:
お返事遅くなり申し訳有りません。
たしかにソースちがいますね…
ブロック再挿入などしてみましたが、変わらずです。プラグインすべて切って検証しましたが、変わらなかったのでプラグインが原因じゃない気がしますね…
以下プラグインリストを乗せておきます。
カスタマイズについては、スタッフページの投稿機能を追加していますが
それを実装する前からの現象ですね…
※こちらの実装は外部でやってもらったので私では詳しくわからないんです…MySnowMonkeyで外部CSSを読み込むようにしてStyle.cssを反映させています。
時間のある時にちょこちょこしらべてはいるんですが、解決さくがわからずこまってます。
いいねをした人: 居ませんお試しいただきありがとうございます。
こちらでも再現してみたところ同じ症状になりました。
該当のスライダーの「画像のアスペクト比」がオリジナルになっていますか？
「16:9」や「4:3」にすると上部の空きが出ないようなんですが、試していただけますか？いいねをした人: 居ません
- トピック「スライダーの読み込みについて」には新しい返信をつけることはできません。