[英]Navbar Not Switching To Fixed When I Scroll By It
For reference here is the url http://buildme.co/ 供参考的网址是http://buildme.co/
I am currently having a issue with my main navbar not switching to fixed as you scroll by it. 我目前在浏览主导航栏时无法切换到固定导航栏。 This is the navbar under the skewed images.
这是倾斜图像下的导航栏。
The Following JavaScript code is supposed to be making it do this 以下JavaScript代码应该可以做到这一点
// Change To Fixed Header
$(document).ready(function(){
$(window).bind('scroll', function() {
var navHeight = $( window ).height() - 100;
if ($(window).scrollTop() > navHeight) {
$('.main-navbar').addClass('navbar-fixed-top');
}
else {
$('.main-navbar').removeClass('navbar-fixed-top');
}
});
});
However this is not the case and nothing happens. 但是事实并非如此,什么也没有发生。
Here is a example of what I am trying to achieve. 这是我要实现的示例。 http://stanislav.it/tutorials/sticky-navigation/
http://stanislav.it/tutorials/sticky-navigation/
It looks like you may need to bind the scroll event to the 'body' in your case (the window scroll event wasn't firing when I checked it on your site but the body was) 看来您可能需要将滚动事件绑定到您的案例中的“ body”(当我在您的网站上对其进行检查时,窗口滚动事件并未触发,但body已激活)
Edit: Oh wait I think I see...It's the overflow styling you've added to html, body: 编辑:哦,我想我看到了...这是您添加到html,body的溢出样式:
html, body {
overflow-x: hidden;
height: 100%;
}
if I get rid of the overflow-x: hidden your code works for me. 如果我摆脱了overflow-x:隐藏的代码对我有用。 I know I've had trouble before with the fact that it's not allowed to have one axis allow overflow and the other not (so if you set overflow-x: hidden it may do funny things with the y scrolling)
我知道我以前遇到过麻烦,因为它不允许一个轴允许溢出,而另一个不允许(所以如果您将overflow-x设置为:隐藏,则它可能会对y滚动产生有趣的作用)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.