0
我正在嘗試創建一個垂直滾動着陸頁。我的HTML用div標記如下＃slide-1，＃slide-2等一直到＃slide-5。通過快速插件和我所做的一些變體的幫助，我可以在頁面滾動頁面時使元素淡入淡出。我只是想知道是否有一種方法，當某些容器在視圖中時，他們會對它們執行特定的動畫。滾動事件中淡入/淡出元素
這裏是js。
// Fading in the elements, etc.
slides = $('.slide');
slides.children('.section').addClass('hiding');
$('#slide-1').children('.section').addClass('showing');
$('#slide-1').find('.centeredPromoImage').addClass('fadeInUpBig');
$(window).scroll(function(d,h) {
slides.each(function(i) {
a = $(this).position().top + $(this).height();
b = $(window).scrollTop() + $(window).height();
if (a < b) {
$(this).children('.section').removeClass('hiding').addClass('showing');
$(this).find('.polaroid').addClass('fadeInRightBig');
$(this).find('.left').addClass('fadeIn')
$(this).siblings('.slide').children('.section').removeClass('showing').addClass('hiding');
}
var grabID = $(this).attr('id');
console.log(grabID);
});
});
我在頁面上使用簡單的css3動畫animate.css。我在使用scrolldeck.js時遇到了一些問題，並希望通過上面的代碼或此代碼的一些變體來創建它。
另外，如果有人不介意澄清爲什麼當我登錄grabID它返回所有五張幻燈片，而不是單個幻燈片。
感謝您的幫助！