javascript - html 要素の読み込みを防止 / 延期する

Question

ポートフォリオを開発しているときに、ページの読み込みを完了するにはすべての画像を読み込む必要があるため、ページの読み込みに時間がかかることに気付きました。

そのため、ロードを防止または停止し、後で許可する方法があるかどうか疑問に思っていました。

つまり、ロードをすぐに防止し、ロードされた別の要素をクリックすると、#title と言ってから .images をロードします。

これは可能ですか？

前もって感謝します！

Answer 1

このようなもの：

HTML

<img src="" class="lazyload" data-attr="image1.jpg" alt="Alt" title="Title" width="50" height="50" />

Jquery

$('#title').click(function(){
    $('.lazyload').each(function(){
        $(this).attr('src',$(this).attr('data-attr'));
    });
});

または、わずかに異なる機能のためにLazyLoadプラグインを使用することもできます。