滚动 div 错误

Posted 2023-05-09

【中文标题】滚动 div 错误

【英文标题】：Scrolling Div bug

【发布时间】：2018-05-05 15:31:45

【问题描述】：

我有一个滚动 div 的错误，因为它给我添加了一个空格，我不知道如何消除它

<script type='text/javascript'>
$(window).scroll(function() 
    var nav = $(".menu");
    var top = 200;
    if ($(window).scrollTop() >= top) 

        nav.addClass("-fixo menunu");

     else 
        nav.removeClass("-fixo menunu");
    
);
</script>

问题是 div 从 <div class="menu"> 更改为 <div class="menu -fixo menunu"> 并且它必须没有空格，例如 <div class="menu-fixo menunu">。有什么建议吗？

【参考方案1】：

您不能仅添加/删除带有addClass 或removeClass 的类的后缀。

首先，删除.menu并添加menu-fixo menunu。

删除var nav，因为它只会在.menu 而不是.menu-fixo 时获取菜单元素。

var top = 200;
if ($(window).scrollTop() >= top) 
  $(".menu").removeClass("menu").addClass("menu-fixo menunu");
 else 
  $(".menu-fixo").removeClass("menu-fixo menunu").addClass("menu")

【讨论】：

它可以工作，但是当我回到顶部时，它仍然是 menu-fixo menunu。我能做什么？

删除var nav，因为当它是.menu而不是.menu-fixo时，它只会得到菜单元素。

【参考方案2】：

addClass 和 removeClass 将添加/删除单个类，而不是对类属性字符串中的所有类进行操作。

试试这个

if ($(window).scrollTop() >= top) 
    nav.removeClass("menu");
    nav.addClass("menu-fixo menunu");
 else 
    nav.addClass("menu");
    nav.removeClass("menu-fixo menunu");

【讨论】：

它可以工作，但是当我回到顶部时，它仍然是 menu-fixo menunu。我能做什么？