Back to top button. Offset aka 680 is the height of the page to start
var _initBackTotopBtn = (backToTopBtnId) => {
jQuery(window).scroll( (e) =>{
if(window.pageYOffset >= 680) {
jQuery(backToTopBtnId).show('slow');
}
else{
jQuery(backToTopBtnId).hide('slow');
}
});
jQuery(backToTopBtnId).click( (e) => {
jQuery("html, body").animate({ scrollTop: 0 }, "slow");
return false;
});
}<div class= "backToTop">
<i class="material-icons">keyboard_arrow_up</i>
</div>.backToTop {
align-items: center;
background: var(--pink);
border-radius: 50%;
bottom: 10px;
color: #fff;
display: flex;
font-size: 50px;
height: 50px;
justify-content: center;
padding: 16px 0;
position: fixed;
right: 10px;
width: 50px;
transition: all .5s ease;
}
.backToTop:hover {
background: var(--main-text-color);
cursor: pointer;
transform: rotate(360deg);
}