Я использую Paul Irish's Infinite-Scroll jQuery plugin в сочетании с изотопом. Кажется, что он работает хорошо, за исключением одного: анимация загрузки вообще не появляется. Кроме того, когда вы прокручиваете вниз, исходные ссылки на страницы отображаются на секунду, затем они исчезают, а через секунду или около того наступает следующая страница. Поскольку для загрузки второй страницы требуется секунда, мне бы очень хотелось, чтобы анимация загрузки отображалась так, что пользователь знает, что загружается другая страница. Как заставить невидимые ссылки на страницы и анимацию загрузки? Ниже приведен код, я использую:Бесконечная анимация анимации прокрутки не работает
// Isotope (with Infinite Scroll)
$(function(){
var $container = $('.isotope-container');
$container.imagesLoaded(function(){
$container.masonry({
itemSelector: '.isotope-item',
layoutMode: 'masonry'
});
});
// filter items on button click
$('#filters').on('click', 'button', function() {
var selector = $(this).attr('data-filter');
$container.isotope({ filter: selector });
});
$container.infinitescroll({
navSelector : '.pagination', // selector for the paged navigation
nextSelector : '.next-post a', // selector for the NEXT link (to page 2)
itemSelector : '.isotope-item', // selector for all items you'll retrieve
loading: {
finishedMsg: 'No more pages to load.',
msgText: "loading new posts",
img: 'http://i.imgur.com/6RMhx.gif',
selector: "#loading-animation"
}
},
// trigger Masonry as a callback
function(newElements) {
// hide new items while they are loading
var $newElems = $(newElements).css({ opacity: 0 });
// ensure that images load before adding to masonry layout
$newElems.imagesLoaded(function(){
// show elems now they're ready
$newElems.animate({ opacity: 1 });
$container.masonry('appended', $newElems, true);
});
}
);
});
EDIT: При проверке страницы, это выглядит как погрузочная DIV #infscr-loading
загружает в верхней части страницы под другими элементами. Но я не могу понять, как получить его для загрузки внизу ...
Необходимо больше узнать о вашем коде. Как насчет jsFiddle? – Macsupport
Вот сайт: http://uic.slamagency.com/blog/ – mcography
только FYI, в Safari, ваш сайт вызывает загрузку masthead-teaser.ogv при каждой загрузке страницы. Отдельный, но вы должны это исправить! Кроме того, сайт показывает, что изотоп загружен, но вы указываете в коде, кладку? – Macsupport