html:
<!--pc端按鈕-->
<div id="top" class="top" ><img src="../../img/pc/top.png" alt=""></div>
<!--移動(dòng)端端按鈕-->
<div id="top2" class="top2"><img src="../../img/pc/top2.png" alt=""></div>
js:
/**
* 點(diǎn)擊top按鈕回到頂部
*/
$('#top,#top2').on('click',function () {
$("html, body").animate({scrollTop: 0 }, {duration: 500,easing: "swing"});
return false;
});
/**
* 監(jiān)聽頁面
* */
$(window).bind('scroll',function(){
if(window.innerWidth >= 768){
var len=$(this).scrollTop();
if(len>=100){
//顯示回到頂部按鈕
$('#top').fadeIn('1000');
}else{
//影藏回到頂部按鈕
$('#top').fadeOut('1000');
}
}else {
var len=$(this).scrollTop();
if(len>=100){
//顯示回到頂部按鈕
$('#top2').fadeIn('1000');
}else{
//影藏回到頂部按鈕
$('#top2').fadeOut('1000');
}
}
});