如何淡出，淡入窗口滚动的div？

Posted 2023-05-08

【中文标题】如何淡出，淡入窗口滚动的div？

【英文标题】：How to fade out, fade in a div on window scroll?

【发布时间】：2012-05-25 21:32:20

【问题描述】：

我的 div 在滚动 100 像素后很好地淡出，但在滚动 300 像素后不会淡出。

有什么想法吗？

$(document).ready(function()
    $(window).scroll(function () 
        if ($(this).scrollTop() > 100) 
            $('#menuWrap').animate(opacity: 0.5, 1000);   
             
        if ($(this).scrollTop() > 300) 
            $('#menuWrap').animate(opacity: 1, 1000);
            
     );
);

【参考方案1】：

尝试在animate(..) 之前添加stop() 或stop(true,true)：

$(document).ready(function()
    $(window).scroll(function () 
        if ($(this).scrollTop() > 100) 
            $('#menuWrap').stop().animate(opacity: 0.5, 1000);   
             
        if ($(this).scrollTop() > 300) 
            $('#menuWrap').stop().animate(opacity: 1, 1000);
            
     );
);