gpt4 book ai didi

javascript - 顶部菜单在 div 滚动条上显示和隐藏

转载 作者:行者123 更新时间:2023-11-28 12:05:36 27 4
gpt4 key购买 nike

我创建了一个脚本,该脚本应该显示菜单正在摇晃并在您按下时将其隐藏。现在,如果滚动是主体,它就可以工作,但如果我在溢出条件下使用 div,我该怎么做?

我的脚本很简单

var lastScroll = 0;
$('#ipotetic div').scroll(function(event){


var st = $(this).scrollTop();
$('.header').stop();

if (st > 54) {

$('.header').css({"box-shadow" : "0 4px 0 rgba(0,0,0, 0.1)"});

if (st > lastScroll){
//down
$('.header').animate({top:'-54px'},200,'swing');
}
else {
//up
$('.header').animate({top:'0px'},200,'swing');
}
lastScroll = st;
}
else { $('.header').css({"top" : "0"}); $('.header').css({"box-shadow" : "none"}); }
});

这是div结构

<div class="wrap"><div class="overflower"><div class="sizer">#content</div></div></div>

和CSS

.wrap {height:100%;position:relative;float:left;overflow:hidden;}
.overflower {width:410px;overflow:auto;height: 100%;}
.sizer {width:390px;}

它与 $(window).scroll(function(event){ 完美配合但是,为什么使用 div 它不起作用,有什么想法吗?

最佳答案

是的,<div> 是可能的只要内容溢出和 CSS overflow:auto or scroll应用于 div。在 documentation 上有详细说明我还在 jsfiddle 上测试过.

关于javascript - 顶部菜单在 div 滚动条上显示和隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19723848/

27 4 0