使用面临代码问题的 jquery 创建返回顶部按钮答案

【问题标题】：Create back to top button using jquery facing issue with code使用面临代码问题的 jquery 创建返回顶部按钮
【发布时间】：2017-02-23 10:32:44
【问题描述】：

我的index.php 上有固定按钮，当用户位于页面底部时，该按钮适用于进入顶部。

<button id="fixed-btn"></button>

它的css是这样的。

#fixed-btn{
 position: fixed;
    bottom: 50px;
    right: 50px; 
    height: 30px;
    width: 30px;
    border-radius: 100%;
    background-color: red;
 opacity: 0;
}
#fixed-btn.show{
    opacity: 1;
}

为此，我编写了 jquery

$(document).ready(function()
{
  function testScroll(ev)
  {
    if(window.pageYOffset>400)
    {
      $('#fixed-btn').addClass('show');
    }
    else
    {
      $('#fixed-btn').removeClass('show');
    }
  }
  window.onscroll=testScroll
  $("#fixed-btn").click(function()
  {
    $('html, body').animate(
    {
      scrollTop:0
    }, 1500 );
  });

我不知道为什么它不工作。按钮不可见。任何人都可以对此有所了解，然后请分享。在此先感谢:)

【问题讨论】：

你尝试过 css 中的 z-index 吗？ @foram
它对我来说很好用。检查jsfiddle.net/ou5rrww6
你最后错过了这个});

标签： javascript jquery html css scrolltop

【解决方案1】：

我看到你的代码我认为这将解决你的问题。用下面给出的替换你的 css

#fixed-btn{
 position: fixed;
    bottom: 50px;
    right: 50px; 
    height: 30px;
    width: 30px;
    border-radius: 100%;
    background-color: red;
 z-index: 9999;   
 opacity: 0;
}

你只需在这个#fixed-btn{..}中添加z-index: 9999;

如果仍然遇到问题，请告诉我。

【讨论】：