Question

当.main-nav container .addClass时，我正在构建我的个人作品集，并jQuery与我的.main-nav { width: 100%; height: 5em; background: #595959; box-shadow: 2px 2px 2px rgba(0,0,0, .3); justify-content: center; align-items: center; z-index: 1; } .sticky { position: fixed; top: 0; }折叠。以下是它的外观：

var yourNavigation = $(".main-nav");
    stickyNav = "sticky";
    myHeader = $('.main-header').height();

$(window).scroll(function() {
  if( $(this).scrollTop() > myHeader ) {
    yourNavigation.addClass(stickyNav);
  } else {
      yourNavigation.removeClass(stickyNav);
  }
});

Jquery：

.main-nav

因此，当我在标题下滚动时，ind = pd.Index([f"{e[0]} - {e[1]}" for e in mi])变得固定，其下的容器占据了顶部留下的空间，这使其崩溃。

有什么建议吗？欢迎任何帮助！

谢谢！

Answer 1

如果我理解正确，当导航栏固定时，它会被驱动到左上角。

解决方案非常简单。将其添加到.sticky样式：

.sticky {
  ...
  right: 0;
  left: 0;
  ...
}

如果它不适合您，请发布您的html，以便我们可以尝试（更好，创建一个JS小提琴），澄清您的问题并提供显示错误的屏幕截图。

容器在addClass上折叠

1 个答案: