Q&A
前提・実現したいこと
現在、画像をクリックするとポップアップ表示ができるような、下記jQueryコードを使用していますが拡大前の画像が単一ページに複数あるため、いくつかの画像の読み込みが遅くなってしまっています。
下記のHTMLを複数設定しています。
これを解決する方法はありますでしょうか。
小さい画像サイズを用意することも考えましたが、画像量が多いため負担になってしまいます。
よろしくお願いいたします。
該当のソースコード
jQuery
1 2<link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/css/lightbox.css" rel="stylesheet"> 3<script src="https://code.jquery.com/jquery-1.12.4.min.js" type="text/javascript"></script> 4<script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.7.1/js/lightbox.min.js" type="text/javascript"></script>
HTML
1 <li> 2 <a href="aiueo1.jpg" data-lightbox="aiueo"><img src="aiueo1.jpg" width="240" height="155"></a> 3 </li>
回答1件
0
ベストアンサー
やっぱり画像を圧縮したほうがいいんじゃないでしょうか？
Pythonとか覚えれば画像を一括圧縮するプログラムとかも書けます。
https://salapy.hatenablog.com/entry/2019/05/30/111317
あとは
<img src="aiueo1.jpg" width="240" height="155" loading="lazy">
とかにするとページは表示しつつ、ユーザーに見えない画像の読み込みを遅延させて見える部分を高速化できます。
投稿2021/06/12 12:42
総合スコア626
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。