Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save brunolimadevelopment/973169d2e3ed58c0bfd0a094ba61d063 to your computer and use it in GitHub Desktop.
Save brunolimadevelopment/973169d2e3ed58c0bfd0a094ba61d063 to your computer and use it in GitHub Desktop.
[JS] - Back to Top button Scroll
// html
<a href="javascript:void(0);" id="scroll" title="Scroll to Top" style="display: none;">Top<span></span></a>
// css
#scroll {
position:fixed;
right:10px;
z-index: 9999;
bottom:10px;
cursor:pointer;
width:40px;
height:40px;
background-color:#807474;
text-indent:-9999px;
display:none;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
#scroll span {
position:absolute;
top:50%;
left:50%;
margin-left:-8px;
margin-top:-12px;
height:0;
width:0;
border:8px solid transparent;
border-bottom-color:#ffffff
}
#scroll:hover {
background-color:#000;
opacity:1;
filter:"alpha(opacity=100)";
-ms-filter:"alpha(opacity=100)";
}
// js
function scrollTop() {
$(window).scroll(function(){
if($(this).scrollTop() > 100){
$('#scroll').fadeIn();
}else{
$('#scroll').fadeOut();
}
});
$('#scroll').click(function(){
$("html, body").animate({ scrollTop: 0 }, 600);
return false;
});
}
scrollTop();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment