1

ここを含む多くの投稿を閲覧しました

遅延読み込みで画像が表示されない

しかし、私はまだ問題を抱えています。理由はわかりませんが、imgはまったく表示されません。

これは私のコードです 

<head>
    <script src="jquery.js" type="text/javascript"></script>
    <script src="jquery.lazyload.js" type="text/javascript"></script>    
    <script>    
        function(){$("img.lazy").show().lazyload();}
    </script>        
</head> 


<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
<img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">

4

2 に答える 2

1

プラグインを呼び出すスクリプトでは、layzyload呼び出されない匿名関数でラップしました。jQuery

次のスクリプト

function(){$("img.lazy").show().lazyload();}

する必要があります

$(function(){
    $("img.lazy").lazyload();
});

これは、 http://jsbin.com/uberoh/1/editの実用的な例です

もう1つのより簡単なオプションは、ドキュメントの終わりに移動する<script>$("img.lazy").lazyload();</script>ことheadですbody。この場合、スクリプトは結局<img>domcumentにすでに実行されているため、jqueryセレクターがアクセスできます$("img.lazy")

HTML

<body>
    ...
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    <img data-original="img/66_Rafael Ginatulin -white GREEN LIFE 001.jpg"  width="640" height="480" class="lazy">
    ...
    <script>$("img.lazy").lazyload();</script>
</body>

上記のコードの実際の例は、ここを参照してくださいhttp://jsbin.com/uberoh/3/edit

于 2013-08-09T15:14:13.973 に答える