jquery
  • google-chrome
  • scrollto
  • 2012-06-20 191 views 7 likes 
    7

    我有一個jQuery代碼從這個鏈接(頁面結束): How to scroll to top of page with JavaScript/jQuery?滾動時頁面加載

    你爲什麼不只是使用一些參考元素在 HTML文件的開始,像

    <div id="top"></div> 
    

    ,然後加載網頁時,只需做

    $(document).ready(function(){ 
    
        top.location.href = '#top'; 
    
    }); 
    

    如果此功能後,觸發瀏覽器卷軸,你根本就

    $(window).load(function(){ 
    
        top.location.href = '#top'; 
    
    }); 
    

    現在,一切工作,但不是在谷歌瀏覽器! 我該如何解決谷歌瀏覽器的這段代碼? 以及如何我可以添加一些動畫到這段代碼?如滾動速度或快,慢等...

    回答

    17

    如果您使用jQuery,您可以使用scrollTop來滾動。這是一種方法,但也可以製作動畫。下面是文檔:jQuery API Documentation for scrollTop

    您可以使用它像這樣:

    $("html,body").scrollTop(0); 
    

    或爲動畫:

    $(document).ready(function() 
    { 
        $("html,body").animate({scrollTop: 0}, 1000); 
    } 
    

    $("html,body").animate({scrollTop: 0}, 1000); 
    

    你可以在任何事件處理程序中設置此

    或者:

    $(window).load(function() 
    { 
        $("html,body").animate({scrollTop: 0}, 1000); 
    } 
    
    +0

    針對HTML標籤和body標籤在Chrome中應該可以正常工作。 – lewiguez

    +0

    謝謝你。現在我可以如何爲這段代碼添加速度或動畫? top.location.href ='#top'; – Alireza

    +0

    你不能猜到。你沒有設置標量屬性,所以不能動畫。基本上,動畫只是一個增加值的循環。這只是爲無法增加的內容設置一個值。現在,您可以找到#top元素和scrollTop垂直位置。您可以通過將動畫代碼中的scrollTop設置爲不是0,而是將其設置爲垂直位置值。 – lewiguez

    0

    (我建議你的回答lewiguez在實踐中給了,但仍然不知道爲什麼你的方法並沒有在谷歌Chrome瀏覽器。)

    ,這似乎是爲我工作,我不知道關於窗口的負載。儘管點擊鏈接,我測試了實際的「top.location.href」這一行。

    $('#bottomlink').click(function(){ 
        top.location.href="#top"; 
        return false; 
    }); 
    

    這是靠近頁面的頂部。

    <p id="top">lorem ipsum</p> 
    

    這是鏈接在頁面的底部。

    <a id="bottomlink" href="#">Bottom Link</a> 
    
    +0

    我需要頁面加載後的aotomatic滾動。我沒有需要鏈接錨點或類似這樣的東西我需要滾動到頁面加載後錨定aotomatic我有它,但我的問題是谷歌Chrome瀏覽器 – Alireza

    +0

    你有沒有檢查控制檯在Chrome中的任何錯誤? –

    +0

    好吧,我把id =「top」放在body標籤中,現在一切正常。現在我該如何爲這段代碼添加速度或動畫呢?top.location.href ='#top'; – Alireza

    相關問題