Собственно, все сделал как сказано в документации, и все нормально работает, вот только в Chrome и IE. В FF и Opera изображения вообще не отображались.
Пример из документации:
<img class="lazy" data-original="img/example.jpg" width="765" height="574">
$("img.lazy").lazyload({
effect : "fadeIn"
});
Мой код:
<img class="lazy" data-original="img/folio/quarantie_modal.jpg" width="100%" height="100%">
$("img.lazy").lazyload({
effect : "fadeIn"
});
В общем, всё аналогично (не знаю может ли быть проблемой указания размеров в %, но я пробовал и в px - результат тот же).
Пробовал залезть к ним в демку, пошариться в коде страницы. Там они пишут следующее:
<img src="img/viper_corner.jpg" class="lazy img-responsive"
data-original="img/viper_corner.jpg" alt="Viper Corner" height="574" width="765">
Как видно, в наличии атрибут 'src'. Ну ладно, подумал я, попробую добавить. В результате (как это не очевидно) lazy load просто перестал работать.
Короче, как заставить работать его в Firefox и Opera? :)
UPD: В общем нашел другую реализацию:
https://github.com/aFarkas/lazysizes