я использую http://www.appelsiini.net/projects/lazyload но это не работает для вкладок результатов изображения, которые генерируются циклом php и выводятся с использованием jquery ajax serializearray на вкладках начальной загрузки. Поэтому я попытался поместить эти коды в функцию успеха ajax и вместе с выводом, но ничего не получалось.
$("#container").one("click", function() {
$("#container").load("images.html", function(response, status, xhr) {
$("img.lazy").lazyload();
});
});
Источник: http://www.appelsiini.net/projects/lazyload/enabled_ajax.html
$("img.lazy").lazyload({
effect: "fadeIn"}).removeClass("lazy");
$(document).ajaxStop(function(){
$("img.lazy").lazyload({
effect: "fadeIn"}).removeClass("lazy");
});
Источник: Ленивая загрузка привязки к новым изображениям, вставленным после запроса ajax
Спасибо за помощь!
Обновить
Часть проблемы найдена установкой контейнера. Этот код добавлен в функцию успеха ajax.
$("img.lazy").lazyload({
threshold : 100,
effect : "fadeIn",
container: $(".resulttab, .resulttab2")
});
$('.resulttab, .resulttab2').trigger('scroll');
Затем этот добавляется в функцию готовности документа.
$(document).ready(function(){
$("img.lazy").lazyload({
effect: "fadeIn"}).removeClass("lazy");
})
Теперь остающаяся проблема, изображения в другой вкладке. Изображения не загружаются, пока я не прокручиваю страницу. Я пытался вызвать прокрутку при нажатии на вкладку, но это не сработало. Это то, что я пытался, но оба не работали.
//Attempt one
$( "#display" ).on( "tabsbeforeload", function( event, ui ) {
$('.resulttab').trigger('scroll');
})
//Attempt two
function triggerscroll() {
$('.resulttab').trigger('scroll');
}
Задача ещё не решена.
Других решений пока нет …