0

我正在尝试制作一个从页面顶部绝对位置开始的菜单，然后一旦窗口滚动到某个点以下，菜单就会跳转到顶部的固定位置，然后使用 jQuery 创建向下滑动的效果。如果窗口向后滚动到该点之上，菜单应该向上滑动，然后回到页面顶部的原始位置。

不幸的是，我可以让幻灯片向下工作，但不能向上滑动，它只是消失了，不会回到顶部。我知道这是由 slideDown() 函数设置的内联样式引起的，display: none;但既没有重置它以阻止使用 css!important和 jQuery 工作。[这里][http://codepen.io/SawyerK/pen/HrgDE] 是一支我有一部分工作的笔。有想法该怎么解决这个吗？

我的 jQuery 代码：

$(document).ready(function() {
  var header = $("header");

  $(window).scroll(function() {
    if ($(window).scrollTop() > $(window).height()) {
      header.addClass("fixed").slideDown();
    } else {
      header.slideUp().removeClass("fixed");
    }
  });  
});

并且固定类只是设置position: fixed; display: none;，因此 slideDown 功能可以工作。有任何想法吗？

4

1 回答 1

0

你需要等到slideUp完成。

$(window).scroll(function() {
  if ($(window).scrollTop() > $(window).height()) {
    header.addClass("fixed").slideDown();
  } else {
    header.slideUp(400, function() {
      header.removeClass( "fixed" );
    });
  }
});
于 2013-09-19T07:28:33.380 回答