Итак, я возился с jQuery Waypoints для проекта, над которым сейчас работаю. Я использовал его в прошлом, и у меня не было проблем, но для этого конкретного проекта я не могу заставить его работать. Что отличается на этот раз, так это то, что весь контент внедряется с помощью JavaScript, хотя это не должно быть проблемой, поскольку вы используете $.waypoints('refresh');
для простого обновления позиций путевых точек.
Поскольку содержимое создается на лету, я ввел таймер, чтобы убедиться, что содержимое загружено до инициализации скрипта.
$(document).ready(function(){
setTimeout(function(){
waypoints();
$.waypoints('refresh');
}, 2000);
});
function waypoints() {
alert('jQuery Waypoint has initialized');
//ep.listener.waypoints()
$(function() {
var $things = $('article.curr section');
$things.waypoint(function(direction) {
if (direction === 'down') {
//do stuff
console.log(this);
console.log('down');
}
}, { offset: '50%' });
$things.waypoint(function(direction) {
if (direction === 'up') {
//do stuff
console.log(this);
console.log('up');
}
}, {
offset: function() {
return $.waypoints('viewportHeight') / 2 - $(this).outerHeight();
}
});
});
}
Что происходит, так это то, что путевые точки запускаются только один раз и только один раз. Он распознает только самый верхний раздел и ничего больше, если вы не прокрутите вниз и не обновите страницу, тогда он распознает все четыре элемента.
Что я здесь делаю неправильно?
Демонстрация доступна ЗДЕСЬ
Имя пользователя: dev
Пароль: лолбой