问题描述
当用户向下滚动时,我希望div出现在顶部,并传递一个名为.header1
的div类(该div内部还有3个div)
I want a div to appear at the top when user scroll down pass a div class called .header1
(This div has 3 other div inside)
我希望导航出现在该.fixedDiv
中.我在 此处找到了答案 ,但是我无法在我的网站上实施它.这就是我得到的
I want the nav to appear in that .fixedDiv
. I found my answer here, but I have not been able to implement it on my site.Here is what I got
<script type="text/javascript">
var startY = $('.header1').position().top + $('.header1').outerHeight();
$(window).scroll(function () {
if( $(this).scrollTop() > startY ){
$('.fixedDiv').slideDown();
}else{
$('.fixedDiv').slideUp();
}
});
</script>
我的网站上有一个名为.fixedDiv
的div,上面显示topnav,我的问题是div始终存在.向下滚动时不会隐藏或显示.
And I have a div called .fixedDiv
on my site saying topnav, my problem is the div is always there. It doesn't hide or appear when scrolling down.
这是指向我的网站的链接.
This is a link to my website.
对于CSS,我没有为.header1
进行任何设置,因为其他div位于其中,并且它们应该是.fixedDiv
出现所需的高度.并且.fixedDiv
具有CSS
For css I have nothing setup for .header1
because other div are inside and they should be the height needed for .fixedDiv
to appear. And .fixedDiv
has css
.fixedDiv {
position:fixed;
top:0px;
left:0px;
background:orange;
}
我知道我已经接近完成这项工作,但是我似乎无法弄清我所缺少的内容.
I know I'm close to getting this working but I just can't seem to figure out what I'm missing.
推荐答案
所以终于弄明白了,我喜欢它,它看起来很棒
So finally got it figured out, and I love it, it looks great
jQuery(document).ready(function() {
var startY= jQuery('.header1').position().top + jQuery('.header1').outerHeight();
jQuery('.fixedDiv').html( jQuery('#nav').html());
jQuery(window).scroll(function () {
if(jQuery(this).scrollTop() > startY ){
jQuery('.fixedDiv').slideDown();
}else{
jQuery('.fixedDiv').slideUp();
}
});
});
不知道多余的行(第3行)做什么,但是缺少的是...谢谢
Not sure what the extra line (line 3) does but that what was missing ...Thank You
这篇关于向下滚动时使Nav Div出现的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!