javascript - 添加使用 jquery 使用鼠标和浏览器进行滚动的类

Question

您好，我需要一些有关问题的帮助，我有一个固定菜单，在捕获坐标时会固定，当我用鼠标滚动或直接在浏览器上滚动时菜单会粘住，我想添加一个类，但如果单击菜单我想删除该类，这是我的代码:

$(document).on('scroll', Amargin);

function Amargin(e) {

  if ($('nav').hasClass('fixed_menu')) {
    $('main').addClass('margin');
  }
  else
  {
    $('main').removeClass('margin');
  }

  e.preventDefault();
}

我还在标签导航中添加了一个调用fixed_menu的类，这使得菜单的位置固定，这就是为什么我使用if语句，因为我只想在类fixed_menu出现时添加类边距，并且当我用鼠标或浏览器进行滚动，但当我单击菜单时我想将其删除时，请记住，当我单击粘性菜单时，它会移动捕获scrollTop和offset.Top事件，从而制作动画页面.

Answer 1

这似乎是一个很酷的主意，所以我想尝试一下。我认为您正在寻找类似 this JSFiddle 的东西.

你的逻辑有问题。基本思想是，如果顶部有一个导航栏，您希望当用户滚动经过顶部导航栏时，出现一个新的导航栏并粘在屏幕顶部。因此，您需要检查用户距文档顶部的位置是否大于导航栏的高度。

var top = $('body').scrollTop();
var navHeight = $('#navBar').height();

if(top > navHeight) {
    $('#fixedBar').fadeIn();
} else {
    $('#fixedBar').fadeOut();
}

我可以使其更加动态，这样就不需要第二个导航栏，但对于这个例子，我相信这种方法是有效的。