使用下面的代码适用于Firefox,Edge和Chrome移动设备,但是当它在最新版本的Chrome中达到顶峰时,我无法获得该元素的闪烁效果?
我需要为浏览器调整哪些想法?
$(document).ready(function(){
var $backToTop = $(".back-to-top");
/* this hides the back to top button when the page first loads */
$backToTop.hide();
/* now we need to write a function that makes the back to top button appear after the user has scrolled a certain amount */
$(window).on('scroll', function() {
if ($(this).scrollTop() > 600) { /* back to top will appear after the user scrolls 600 pixels */
$backToTop.fadeIn();
} else {
$backToTop.fadeOut();
}
});
/* this function activates a smooth scroll to the top of the page when the back to top button is clicked */
$backToTop.on('click', function(e) {
e.preventDefault();
$("html, body").animate({scrollTop: 0}, 500);
return false;
});
})
<a href="#" class="back-to-top" style="display: inline;">
<i class="fa fa-arrow-circle-up">Back to Top</i>
</a>
.back-to-top {
background: none;
margin: 0;
position: fixed;
bottom: 0;
right: 0;
width: 160px;
height: 70px;
z-index: 100;
display: none;
text-decoration: none;
color: #ffffff;
background-color: #6eb1b5;
box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.12);
padding:25px;
}
.back-to-top i {
font-size: 18px;
}