Question

我的网站有一个问题，我添加了“返回顶部”功能，我整天用它来修复它，但我找不到答案。所以我希望有人可以帮助我。

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

“回到顶部”我从这里得到它 - ＆gt; http://www.developerdrive.com/2013/07/using-jquery-to-add-a-dynamic-back-to-top-floating-button-with-smooth-scroll/

有办法防止这个问题吗？

编辑1-2 测试页面 - ＆gt; http://pizzapastaplace.dk/frhavn - ＆gt;选择菜单并向下滚动。和刷新比你会看到问题。它在刷新后立即显示

编辑3 我在这里按照本教程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文件。这就是我所做的一切

Answer 1

按钮没问题页面必须在按钮显示之前完全加载。

按钮工作正常我没有刷新页面我只是等到页面完全加载才向下滚动。

另请注意我正在使用谷歌浏览器

如果您没有使用该浏览器，那么浏览器会出现问题我注意到Torch在渲染您的页面方面存在很多问题，但火炬总是会出现问题

编辑：

移动这个

<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>

编辑2：

我认为我知道主要问题在哪里当主页首次加载时，它根本不会放置一堆脚本特别是

    <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>

我注意到，当这些不加载按钮时不显示你应该这样做，以便这些脚本在开始时加载，而不仅仅是当它到达菜单页面时，因为这些脚本仅在你通过刷新直接加载菜单部分时出现，所以将这些脚本移动到页面的头部，因为它们显然需要我不确定需要哪些，但在这一点上，他们应该绝对是在头部标签而不是在身体，以防止他们没有被加载

编辑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中并且需要移动到那里

Jquery有“返回顶部”功能的问题/需要刷新

1 个答案: