粘性导航下面的断点不固定顶部

Question

我是相当新的基金会，我搜索这个答案无处不在，但无法找到它。

试图创建一个页面，该页面具有启动页面的一半的导航。当滚动导航将坚持顶部。这很容易，就像一个魅力..

但是，当您进入页面的屏幕较小，我想'移动'菜单固定在顶部，而不是浮动在页面周围。

股利我身边有我的是：

<div class="contain-to-grid sticky"> 

希望有人知道我怎样才能使这项工作。

Answer 1

几个选项，你可以只使用一个媒体查询为小屏幕，一样的东西：

@media only screen and (max-width: 40em) { 
    .sticky { 
     position: fixed !important; 
     top: 0px !important; 
    } 
} 

或者当屏幕尺寸很大，你可以有条件地只加载麦哲伦（或任何方法，你正在使用）足够，例如

if($(window).width() > 670){ 
    // init sticky nav stuff here 
}