Question

我试图让这个工作无济于事。我正在尝试在滚动浏览特定DIV时更改菜单项的CSS。

在这种情况下，当我滚动标记为＃section-1的div时，我试图获取一个菜单项（＃menu-item-3907）来改变它的背景颜色。

这是我迄今为止尝试过的代码：

var t = $("#section-1").offset().top;

$(document).scroll(function(){
if($(this).scrollTop() > t)
{   
    $('#menu-item-3907').css({"display":"none"});
}
});

Answer 1

var t = $("#section-1").scrollTop();

$(document).scroll(function(){
    if($(this).scrollTop() > t){
        $('#menu-item-3907').css({"background":"yellow"});
    }
});

尝试使用HTML：

<div id="section-1">Section 1</div>
<div id="menu-item-3907" style="margin-top:1500px">Menu</div>

Answer 2

试试这个。

    <script>
$(window).scroll(function() {

    var scroll_pos = window.pageYOffset;



    if(scroll_pos>=300) {
       $("#menu-item-3907").css("background-color","#B44DFE");
    }
    else
    {
        $("#menu-item-3907").css("background-color","#FFF");
    }
}); 

    </script>
<div id="#section-1" style="color:pink;height:300px;border:1px solid">
hi

  </div>  

<div id="menu-item-3907"  style="color:blue;height:300px;border:1px solid">

hi
</div>

http://jsfiddle.net/LnWhJ/1/

滚动到另一个DIV时更改一个DIV的css

2 个答案: