動畫滾動到頂部按鈕不起作用

幾天前我開始使用我的公司網站。我看到它錯過了一些東西，所以我決定用動畫滾動到頂部按鈕。我在編程方面很努力，所以我決定在網上看。在那裏我發現了this的例子。我從字面上複製了整個代碼，但它不起作用。動畫滾動到頂部按鈕不起作用

在HTML按鈕：

<a href="javascript:" id="return-to-top"><i class="icon-chevron-up"></i></a>

，這是jQuery的：

$(window).scroll(function() { 
    if ($(this).scrollTop() >= 50) {   
     $('#return-to-top').fadeIn(200);  
    } else { 
     $('#return-to-top').fadeOut(200); 
    } 
}); 
$('#return-to-top').click(function() {  
    $('body, html').animate({ 
     scrollTop : 0      
    }, 500); 
});

我不知道是什麼問題，因爲它的工作原理上的codepen。有誰知道如何解決這一問題？

在此先感謝

來源

2017-07-07 RonTuip

它使用jQuery，你實現了jQuery CDN到你的頭標籤？ –

沒有足夠的信息，但如果您使用codepen中的相同代碼，那麼您可能需要將jQuery包含到您的網站標題中。（https://cdnjs.com/libraries/jquery/）

來源

2017-07-07 07:21:45

你應該做這樣的事情：

$('#return-to-top').click(function(e) { 
e.preventDefault();  
$('body, html').stop().animate({ 
    scrollTop : 0      
}, 500); 
});

而且首先，請檢查您是否包括jQuery的：

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" 
crossorigin="anonymous"></script>

來源

2017-07-07 07:18:47 Orfeo

您正在使用哪種瀏覽器？

反正$(window).scrollTop(0);似乎是所有瀏覽器都支持，但如果你想動畫滾動，$('html,body').animate({scrollTop:0},500);，就像你使用，如果你可以分享你HTML和CSS代碼，也許問題是在z-index或嘗試將「.icon-chevron-up」的寬度和高度也設置爲「＃返回頂部」。

似乎一切正常，嘗試使用console.log('some string here');來查看代碼是否正在運行。

另外，請檢查您是否添加了jquery腳本： script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>

希望你解決這個問題。

來源

2017-07-07 07:31:51

我注意到很多人告訴我要包含jquery庫。我之前添加了庫，但在檢查完答案後，我注意到我添加了錯誤的庫。所以現在它的固定感謝很多傢伙。

來源

2017-07-07 08:26:11 RonTuip

動畫滾動到頂部按鈕不起作用

回答

相關問題