隱藏導航向下滾動並僅在移動時向上滾動

我試圖隱藏導航向下滾動並僅在移動模式中向上滾動時顯示。我有一個例子，我發現從另一個網站，使用腳本，只是我不擅長解開和調整我的情況。當瀏覽器尺寸很小時，你會發現它可以工作。隱藏導航向下滾動並僅在移動時向上滾動

我有了兩個版本導航：一個內聯當大屏幕的大小和位置是絕對的，在手機屏幕尺寸的第二，一個漢堡包圖標下相互開放的菜單項。

<header> 
<nav> 
    <div class="mobile-nav"> 
     <div class="nav-toggle"><i class="nav-icon"></i></div> 
    </div> 
    <ul class="left-nav"> 
     <li class="home"><a href="#">Pixelation</a></li>  
    </ul> 
    <ul class="right-nav"> 
     <li><a href="#">Work</a></li> 
     <li><a href="#">About</a></li> 
     <li><a href="#">Contact</a></li> 
    </ul> 
</nav> 
</header>

例如網站的腳本的一部分

hideShowMobileNav = function(setOldScroll) { 
    if (stateMap.scrollTop != stateMap.oldScrollTop && stateMap.scrollTop > 100) { 
     if (stateMap.scrollTop > stateMap.oldScrollTop) { 
      jqueryMap.$nav.addClass('hidden'); 
     } else { 
      jqueryMap.$nav.removeClass('hidden'); 
     } 
    } 
    if (setOldScroll) { 
     stateMap.oldScrollTop = stateMap.scrollTop; 
    } 
};

來源

2015-07-13 KP83

你可以使用設備檢測

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) { 
    // Do something 
} else { 
    // Do something else 
}

或width()功能

或某種css媒體查詢

來源

2015-07-13 11:26:15

謝謝，但我知道我的問題是更多我怎樣才能使它與現有的腳本或新的腳本工作。我可以在那裏閱讀和理解JavaScript，但從頭開始編寫它並不是那麼好。 – KP83

隱藏導航向下滾動並僅在移動時向上滾動

回答

相關問題