Question

我正在寻找一些基本的javascript帮助。我有一个固定的菜单，当我向下滚动时淡出。在这一点上，我想淡入一个后顶部按钮，但我唯一的问题是我不能像菜单那样让回到顶部按钮淡入淡出。它一直在闪烁。

我试过使用.stop（）我不确定这是否是正确的方法。

这是我的codepen的链接 - http://codepen.io/veryrobert/pen/xbEaH

HTML

<div>
  <button id="top">Back to top</button>
  <ul id="nav" >
    <li>Menu Item</li>
    <li>Menu Item</li>
    <li>Menu Item</li>
    <li>Menu Item</li>
    <li>Menu Item</li>
  </ul>
</div>

Jquery的

$(window).scroll( function(){

  var scrollTop = $(window).scrollTop()>10;
  var top = $('#top');
  var nav = $('#nav');

  if(scrollTop != 0) {

  nav.fadeOut();  
  top.fadeIn();
  }

  else {
// I was missing my {} 
nav.fadeIn();  
top.fadeOut();
}   
});

如果这很简单，我很抱歉，但我无法理解它。

先谢谢

Answer 1

从显示为none的button开始。

#top { position:fixed; top:50px; display: none;}

http://jsfiddle.net/fkdLE/

另外，不要忘记你的else语句中的{}。

$(window).scroll( function(){
  var scrollTop = $(window).scrollTop();
  var top = $('#top');
  var nav = $('#nav');
  if(scrollTop != 0) {
     nav.fadeOut();  
     top.fadeIn();
  }
  else{
     nav.fadeIn();  
     top.fadeOut();
  }
});

淡出菜单并使用“返回首页”按钮进行切换

1 个答案: