转到顶部按钮在 Firefox 浏览器中不起作用
Go to top button not working in Firefox browser
我有一个 'gototop' 按钮。当用户点击按钮时,页面将向上滚动。它在 Safari 和 Chrome 中运行良好,但在 Firefox 上运行不佳。我认为在 Firefox 中启用了 JavaScript。不确定为什么它不起作用。
$(document).ready(function(){
$(window).scroll (function(){
if($(this).scrollTop()>90) {
$('.goToTop').fadeIn(); }
else{
$('.goToTop').fadeOut();
}
});
var goToTop = document.getElementsByClassName("goToTop")[0];
goToTop.onclick = function(){
$('body').animate({scrollTop:0},600);
};
})
body {
height: 200vh;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<img src="http://placehold.it/45x45?text=^" class='goToTop' style="background: #fff url({{ 'back-to-top.png' | asset_url }}) no-repeat ;
bottom:1px;display:block;opacity:.8; border-radius: 20px;position:fixed;right:1em;height:45px;width:45px; z-index:999">
<div class="sixteen columns page">
{{ page.content }}
</div>
为 body
和 html
添加动画。
$('body, html').animate({scrollTop:0},600);
我有一个 'gototop' 按钮。当用户点击按钮时,页面将向上滚动。它在 Safari 和 Chrome 中运行良好,但在 Firefox 上运行不佳。我认为在 Firefox 中启用了 JavaScript。不确定为什么它不起作用。
$(document).ready(function(){
$(window).scroll (function(){
if($(this).scrollTop()>90) {
$('.goToTop').fadeIn(); }
else{
$('.goToTop').fadeOut();
}
});
var goToTop = document.getElementsByClassName("goToTop")[0];
goToTop.onclick = function(){
$('body').animate({scrollTop:0},600);
};
})
body {
height: 200vh;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<img src="http://placehold.it/45x45?text=^" class='goToTop' style="background: #fff url({{ 'back-to-top.png' | asset_url }}) no-repeat ;
bottom:1px;display:block;opacity:.8; border-radius: 20px;position:fixed;right:1em;height:45px;width:45px; z-index:999">
<div class="sixteen columns page">
{{ page.content }}
</div>
为 body
和 html
添加动画。
$('body, html').animate({scrollTop:0},600);