双向滚动时隐藏固定菜单

Posted 2023-05-09

【中文标题】双向滚动时隐藏固定菜单

【英文标题】：Hide Fixed Menu while scrolling in both directions

【发布时间】：2021-10-26 10:24:33

【问题描述】：

我有一个固定位置的导航栏菜单。当用户向上或向下滚动时，我需要导航栏消失。

我只希望该人回到顶部位置时显示导航栏。

请轻点：我不精通 jQuery，我唯一能做到的就是在向下滚动时隐藏导航栏。

感谢您的帮助，以便我学习！！！

jQuery(function($)
   
var topPosition = 0;
 
 
$(window).scroll(function() 
 
    var scrollMovement = $(window).scrollTop();
   
    if (topPosition < 20 )
    
    else
    if(scrollMovement > topPosition) 
        $('#global-header-section').hide (20);
     else 
        $('#global-header-section').show (20);
    
    
    topPosition = scrollMovement;
);  
   
);

【问题讨论】：

也发布您的 html 代码。

【参考方案1】：

你几乎都在那里。这样的事情会起作用：

var topPosition = 0;

$(window).scroll(function() 
 
    var scrollMovement = $(window).scrollTop();
    var nav = $('#global-header-section');
    if (scrollMovement == topPosition)      
         nav.show (20);
    
    else
        if(!nav.is(':hidden'))         
            nav.hide (20);
        
        
    
    
);

Se 工作小提琴：https://jsfiddle.net/z27xk9bg/2/