图像不透明度在滚动

它是如何工作的？我无法修复它。在这边您可以在滚动时看到不透明度为1的图像。当你停止滚动它消失不透明度为0图像不透明度在滚动

它是如何工作的？这是CSS？

2013-12-09 Kruemmelmonster

您是否在谈论如何在单词滚动时出现“HEYDAY”这个词？ –

您可以通过

$(document).scrollTop()

检查滚动位置我会打电话的setTimeout上比较当前和最后Scrolldown已值的功能，这样，如果身体是在最后一秒滚动我可以告诉。实施细节取决于你。 :-)

来源

2013-12-09 22:12:24 nagylzs

为了使其立即响应，您还可以绑定“mousewheel”和“keydown”事件，但这可能会导致这样一个简单的影响矫枉过正。 – nagylzs

首先，它是'setInterval（）'而不是'setTimeout（）'。其次，无论用户活动如何，每隔几毫秒运行一些代码都会不必要的膨胀。绑定到滚动事件并仅使用计时器来计算滚动停止的时间要简单得多，而这一次只发生几秒钟。 –

试试这个：http://jsfiddle.net/tonicboy/HvuLH/

HTML：

<h1 id="word">HEYDAY</h1> 
<p>a bunch of text</p>

CSS：

#word { 
    position: fixed; 
    top: 50%; 
    left: 50%; 
    display: none; 
}

JAVASCRIPT：

var stopscroll, 
visible = false; 

$(window).on('scroll', function() { 
    clearTimeout(stopscroll); 
    stopscroll = setTimeout(onStop, 250); 

    if (!visible) { 
     $('#word').fadeIn(); 
     visible = true; 
    } 
}); 

var onStop = function() { 
    $('#word').fadeOut(); 
    visible = false; 
};

来源

2013-12-09 22:17:19

图像不透明度在滚动

回答

相关问题