Skip to content

Instantly share code, notes, and snippets.

@kacinskas
Last active December 14, 2015 14:49
Show Gist options
  • Save kacinskas/5102801 to your computer and use it in GitHub Desktop.
Save kacinskas/5102801 to your computer and use it in GitHub Desktop.
Simple scroll to top button example
Demo - http://jsfiddle.net/tadas/uRwGX/1/
/* ---------------------------- */
// Scroll to top
/* ---------------------------- */
$(function() {
var $simpleScrollTop=$('#scrolltop');
$(window).scroll(function() {
if($(this).scrollTop() != 0) {
$simpleScrollTop.fadeIn();
} else {
$simpleScrollTop.fadeOut();
}
});
$simpleScrollTop.click(function() {
$('body,html').animate({scrollTop:0},800);
});
});
<div id="scrolltop" class="box"><i class="icon-chevron-up"></i></div>
or
<div id="scrolltop" class="box">&uarr;</div>
#scrolltop {
position: fixed;
right: 20px;
bottom: 20px;
cursor: pointer;
display: none;
z-index: 999;
}
.box{
padding: 5px 10px;
border: 1px solid #DDD;
background: #FFF;
border-right: 0;
-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, .15);
-moz-box-shadow: 0 2px 3px rgba(0,0,0,.15);
box-shadow: 0 2px 3px rgba(0, 0, 0, .15);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment