2014-06-09 70 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並需要在那裏移動