問題タブ [jquery-lazyload]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - jQuery.Lazy() - ID を持つセクションの背景画像を遅延ロードする
ID を持つセクションのメソッド .lazy() を使用して、1 つの画像に遅延読み込みを適用したいと考えています。このセクションでは、CSS を使用して背景を構成しています。以下はコードです：
HTML
CSS
JS
コードはどのように変更すればよいですか? 今はうまくいかないからです。<img class="lazy" data-src="../img/example.jpg" />以下の例でわかるように、コードとタグがある場合にのみ機能します。
jquery - スマホサイト向け横スクロール機能付きjQuery lazyloadプラグイン
jquery_lazyload プラグインを使用しています。横スクロール div で使用すると、Chrome / Firefox DevTools のモバイル デバイスのシミュレーションと実際のスマートフォン (Android、iOS) で動作しなくなるようです。水平スクロール div が表示されない位置までスクロールすると、プラグインが再び機能し始めます。何かアドバイスをいただければ幸いです。
画像はこんな感じ
jsコードはこんな感じ
jsfiddle: https://jsfiddle.net/heng3rv0/65/show
performance - フォールバック付きのjquery lazyloadイメージとwebp
ピクチャ フォールバック ソリューションを jquery lazyload と組み合わせて使用する方法が少しわかりません。私はこのライブラリを使用します：
現時点では、私の画像は次のように統合されています。
ただし、webp フォールバック ソリューションは次のように構成されています。
私の質問:
統合された遅延ロードが検索するdata-originalため、srcset では機能しません。その解決策はありますか？
可能であれば、別のライブラリを使用せず、コードを「単純に」追加したいと思います。