我正在尝试减少滚动时元素顶部的平滑填充。同时,我希望2个子元素淡入淡出,其中1个元素掉进1英寸。我已经正确地淡出了,但我无法使填充顶部正常工作。有人可以看到我的功能有什么问题吗?
$(window).scroll(function () {
$('.transitionParent').css({
'padding-top' : $(this).scrollTop()-($(this).scrollTop()/500)
});
$('.ipadOutline').css({
'opacity' : 1-($(this).scrollTop()/500)
});
$('.ipadPhoto').css({
'opacity' : 0+($(this).scrollTop()/500)
});
});
http://jsfiddle.net/pXdhB/1/
我也尝试过(没有运气!)
var fromTop = $(window).scrollTop();
$('.transitionParent').css('padding-top', '-' + (100 - fromTop));
最佳答案
像这样吗
演示http://jsfiddle.net/pXdhB/7/
JQUERY
$(window).scroll(function () {
$('.transitionParent').stop().animate({
'padding-top': $(this).scrollTop() - ($(this).scrollTop() / 500)
}, 1000, function () {
// Animation complete.
});
$('.ipadOutline').css({
'opacity': 1 - ($(this).scrollTop() / 500)
});
$('.ipadPhoto').css({
'opacity': 0 + ($(this).scrollTop() / 500)
});
});