簡體   English   中英

顯示/隱藏固定菜單(jQuery)

[英]Revealing / Hiding Fixed Menu (jQuery)

我正在嘗試修復標題動畫並為其設置動畫,以便當用戶從頂部滾動超過80px時,它從瀏覽器窗口的外部彈出。 然后,當用戶向后滾動超過<80px時,我想反轉動畫。 我到目前為止(在代碼前面設置了節流功能):

var e = $(window).scrollTop();
$(window).on("scroll", throttle(function() {
        var t = $(window).scrollTop();
        t > 80 ? t > e ? $(header).animate({
          top: "-150px"
        }, 200) :

在“其他”方面,我完全陷入困境。 我一直在尋找其他類似的功能,並試圖解釋代碼,但確實很掙扎。 任何幫助深表感謝。

為什么將它與e (通常為0 )進行比較。 沒關系 如果您希望windowscrollTop變為80px時發生某些事情,請使用以下代碼。 另外,請不要在animatestop()函數中使用單個true參數。

 $(function () { $(".peek-a-boo").css({ top: -200 }); $(window).scroll(function () { if ($(window).scrollTop() > 80) $(".peek-a-boo").stop(true).animate({ top: 0 }, 200); else $(".peek-a-boo").animate({ top: -200 }, 200); }); }); 
 * {box-sizing: border-box;} .peek-a-boo {position: fixed; background-color: #99f; width: 100%; top: 0; left: 0; padding: 5px; text-align: center;} .heighter {height: 1000px;} 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <header class="peek-a-boo">Peek</header> <div class="heighter"></div> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM