2015-12-06 3 views
0

В настоящее время я использую Lazy Load на тяжелой веб-странице изображения, и я не хочу, чтобы изображения загружались, пока я не нажму кнопку. Lazy Load позволяет вам запускать такие триггеры событий, но я могу лишь частично его обработать.Lazy Load не дожидаясь загрузки изображения, которое находится над сгибом

Изображения под слоем ожидают появления щелчка, но все, что находится над сгибом, загружается, когда страница изначально воспитывается. Это что-то, что нельзя предотвратить, или я делаю что-то неправильно?

Ниже приведен код, который я использую.

<body> 

    <script src="jquery.js"></script> 
    <script src="jquery.lazyload.js"></script> 

    <img src="blank.gif" class="lazy" data-original="image.png" style="height: 500px; width: 500px;"> 

    <script> 
    $("img.lazy").lazyload({ 
     event : "click", 
     effect : "fadeIn" 
    }); 
    </script> 

</body> 

ответ

0

Я думаю, проблема в том, что событие click не связано с элементом html, например. кнопка. Плагин не может справиться с этим из коробки.

Итак, я бы использовал другой плагин (например, justlazy), который более подходит для вашего специального использования.

<body> 
 

 
    <script src="jquery.js"></script> 
 
    <script src="justlazy.js"></script> 
 
    
 
    <span data-src="default/image" data-alt="some alt text" title="some title" 
 
     class="justlazy-placeholder"> 
 
    </span> 
 

 
    <script> 
 
    $("#someButton").click(function() { 
 
     $(".justlazy-placeholder").each(function() { 
 
     Justlazy.lazyLoad(this); 
 
     }); 
 

 
     return false; 
 
    }); 
 
    </script> 
 

 
</body>

Демонстрационная страница плагина содержит много примеров.