Сложный скрипт скролла
Всем привет! Зашел значит в тупик в логике скрипта) На примере понятно до того момента как первый section затухает. Далее по логике следующий section делает fadeIn получает #first, при прокрутке вниз теряет его, и так до последнего. Не могу сообразить как написать условие, после того как анимация возвращает прокрутку вверх...
http://ofb3752.bget.ru/test.html
var windo = $(window);
var blocktop = $('#blocktop');
var animBlock = $('#blocktop').offset().top;
windo.scroll(function (){
if (!blocktop.hasClass('fixed') && windo.scrollTop() > animBlock) {
blocktop.addClass('fixed').data('top', animBlock);
} else if (blocktop.hasClass('fixed') && (windo.scrollTop() < blocktop.data('top'))) {
blocktop.removeClass('fixed');
}
});
var firstSection = $('#first');
var nextSection = firstSection.next();
blocktop.scroll(function (){
if ($(this).scrollTop() > (blocktop.height() / 2)) {
$(firstSection).fadeOut().attr('id', '');
var y = blocktop.animate({
scrollTop: 0,
}, 'fast');
} else {
}
});
|
Задать callback-функцию в параметрах анимации.
|
Спасибо, вышло.
только дальше второго сэкшена процесс не идет.
blocktop.scroll(function (){
if ($(this).scrollTop() > (blocktop.height() / 2)) {
$(firstSection).fadeOut().attr('id', '');
blocktop.animate({
scrollTop: 0,
},
'fast',
function() {
nextSection.fadeIn().attr('id', 'first');
});
}
});
|
>как написать условие, после того как анимация возвращает прокрутку вверх
scrollTop: 0 Что не так? Хотели после того как scrollTop = 0, получили это, а то, что не все "тухнет", так анимация причем? Надо чтобы на протяжении ее от до что-то там тухло, так следите тогда за состоянием анимации - параметр step. |
Спасибо, колбэк то самое. Немножко нашаманил и получилось. Хоть и по-дилетански)
var firstSection = $('#first');
var nextSection = firstSection.next();
blocktop.scroll(function (){
if ($(this).scrollTop() > (blocktop.height() / 2)) {
$('#first').fadeOut().attr('id', '').addClass('next');
blocktop.animate({
scrollTop: 0,
},
'fast',
function() {
$('.next').next().fadeIn().addClass('next')
.prev().removeClass('next').hide();
});
}
else if ($('section:last-of-type').hasClass('next')) {
setTimeout(removeFixed, 1000);
}
});
function removeFixed() {
$('#blocktop').removeClass('fixed');
}
http://ofb3752.bget.ru/test.html |
| Часовой пояс GMT +3, время: 04:44. |