2014-06-09 33 views
1

我确实有Iam添加“回到顶部”功能,我已经用整整一天的时间来修复它,但我无法找到答案的网站的问题。所以我希望有人能帮助我。Jquery与“回到顶部”功能的麻烦/需要刷新

问题 当页面加载一切工作除了“回到顶部”,当我刷新页面按钮显示。其烦人的原因是如果我访问该页面,我需要F5来查看“返回顶部”功能。

“返回顶部”我是从这里 - >http://www.developerdrive.com/2013/07/using-jquery-to-add-a-dynamic-back-to-top-floating-button-with-smooth-scroll/

有没有办法阻止这个问题?

编辑1-2 测试页面 - >http://pizzapastaplace.dk/frhavn - >选择菜单并向下滚动。并刷新比你会看到这个问题。它表明我按照这里本教程http://www.developerdrive.com/2013/07/using-jquery-to-add-a-dynamic-back-to-top-floating-button-with-smooth-scroll/

加入Menu.php

底部
<a href="#" class="back-to-top">Tilbage til toppen <img src="back.gif"> </a>" 

添加脚本和CSS文件的链接刷新

编辑3之后。多数民众赞成我所做的所有

+0

您能发送测试链接吗? – sinisake

+0

发布那些你正在使用的代码,同时显示你的网站破坏或http://jsfiddle.net/将帮助人们帮你 – Andrew

+0

链接添加到问题。 – Tirolel

回答

1

这不是一个按钮的问题页面必须完全加载之前,按钮甚至出现。

该按钮工作正常,我没有刷新页面,我只是等待,直到页面完全加载前滚动下来。

而且在一个侧面说明,我使用谷歌浏览器

,如果你不使用该浏览器比它可能是与浏览器的IM注意到火炬的问题呈现你的页面了很多问题,但话又说回来火炬总是有问题

编辑:

移动这个

<script>    
      jQuery(document).ready(function() { 
       var offset = 220; 
       var duration = 500; 
       jQuery(window).scroll(function() { 
        if (jQuery(this).scrollTop() > offset) { 
         jQuery('.back-to-top').fadeIn(duration); 
        } else { 
         jQuery('.back-to-top').fadeOut(duration); 
        } 
       }); 

       jQuery('.back-to-top').click(function(event) { 
        event.preventDefault(); 
        jQuery('html, body').animate({scrollTop: 0}, duration); 
        return false; 
       }) 
      }); 
     </script> 

到head标签<head> </head>之前日Ë</head>

编辑2:

mkay我想我看到那里的主要问题是 当主第一次加载页面它不把很多脚本,在所有 专门

<script src="js/jquery.djax.min.js"></script> 
    <script src="js/jquery.nicescroll.min.js"></script> 
    <script src="js/jquery.ba-throttle-debounce.min.js"></script> 
    <script src="js/transit.js"></script> 
    <script src="js/jquery.cycle.all.min.js"></script> 
    <script src="js/jquery.maximage.min.js"></script> 
    <script src="js/jquery.colorbox-min.js"></script> 
    <script src="js/owl.carousel.min.js"></script> 
    <script src="js/main.js"></script> 

IM注意到当这些不加载按钮不会显示 你应该做到这一点,以便这些脚本在开始加载,而不是当它进入菜单页面,因为这些脚本只有当你直接加载菜单部分刷新时才显示移动thos e脚本到页面的头部,因为它们显然是需要的im不知道哪些是需要的,但在这一点上它们应该定义在头标记中而不是在身体中以防止它们不被加载

编辑3 :

变化

<script> 
     jQuery(document).ready(function() { 
      var offset = 220; 
      var duration = 500; 
      jQuery(window).scroll(function() { 
       if (jQuery(this).scrollTop() > offset) { 
        jQuery('.back-to-top').fadeIn(duration); 
       } else { 
        jQuery('.back-to-top').fadeOut(duration); 
       } 
      }); 

      jQuery('.back-to-top').click(function(event) { 
       event.preventDefault(); 
       jQuery('html, body').animate({scrollTop: 0}, duration); 
       return false; 
      }) 
     }); 
    </script> 

<script> 
     jQuery(window).load(function() { 
      var offset = 220; 
      var duration = 500; 
      jQuery(window).scroll(function() { 
       if (jQuery(this).scrollTop() > offset) { 
        jQuery('.back-to-top').fadeIn(duration); 
       } else { 
        jQuery('.back-to-top').fadeOut(duration); 
       } 
      }); 

      jQuery('.back-to-top').click(function(event) { 
       event.preventDefault(); 
       jQuery('html, body').animate({scrollTop: 0}, duration); 
       return false; 
      }) 
     }); 
    </script> 

让我知道,如果这有助于与否

编辑4:

尝试移动<a href="#" class="back-to-top">Back to Top</a>直接上面</body>

编辑5:

要求回答这个问题,发现问题后also is <a href="#" class="back-to-top">Back to Top</a> in index.php at all or is it only in menu.php是,这是不是在的index.php并需要在那里移动