---

Date Written: 10/16/12 Last Updated: 10/16/12

A nice little scroll to top script with plenty of settings and features to customise it with!

[b]scroll_to_top.js[/b] –
[CODE]$.fn.scroll_to_top = function(userOptions) {
var check_scroll = 0;
   var defaultOptions = {
image : 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABLCAYAAAA4TnrqAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFMklEQVR4nO2cT2xURRzHv/Pm7b5ut5RWWmgL2+027W7/0z/bdoUISf9p0USEVog1sfFC4olET3jhxMWLHjiYGGOMIUaBeEESDIgHCLFIovyJ/EtxRQuVFKHdf93dNx66VBp2WWY7b98D5nPrZvY3v3ze/GZnZ6ZLkIHNW8eZ29eG4tJyEEXJ1OyZQU8mcW9mGpOXzuHUkQMkXZtHXhx4cxfzNHWioLDI+AwtSmTuPq5dmMDJw58v8bPkj52797GyymoQklbscwVjOm4Hr+Pb/XsXZSzW187d+1h5lVuKSkGIggp3Pd7Y9SF78JoCLJReWWW1eZlZmLWeBmx+/R0GpGR5mjrliMoAURTUtvgBAHTz1nG2trbR5JSsjU0rAAj2Km5fm9m5WB5CCKq9bVCKS8vNzuWpoMDhhPI8LDhFIU1xIGVxIGVxIGVxIGVxIGVxIGVxIGVxoIoKpNlVS34ZZ4whNp8QEkuILKfDjpF+P1Y4HSLCCWU2FMHB42cRiswvO5YQWSqlqKkqw6qV1tuKnrk3B5VSIbHknMWBlMWBkDLUdR0z90LQdZa9cZ75dzYMXdeFxBIiazYcw/5vTqQ5WLMADNCZmIcobOmgMwZYb2AJxXJz1opCDYO9TdDswp6jMCyVUWlxIcaGA/BWV6CyrAQHj59FOLr89ZEoLCPrhWIn3hruRZ1rDQCgo2HhZPzg8QkhC0oRWKIMiwo1jG0JoG7dGiipr0xUUdDudWGkvxuazRrP1PQsVhY5MDYcQH1qRD0MpQq6Gt1IJJM4fOIXRGJxEzL8H1NHltOhYcdQD3zuise26272YMdQD5wOLU+Zpcc0WQ7NhtEBPxprKrPuViiEYH29C6MDfjg0W54yTJOHGZ1qNhXb+rrQ7qsGpU+WAqUK2n3V2NbXZdoclvdenQV2jAz40dVYw/1ehRD0ttRCpdSUT8m8jqzClKh27/KuN7V7Xdje54fdJmbr5UnJmyzNrmKk389VepmgdGFZ8XKgBeoyY/GQlzJ0aHZs7++Cv6lGWExVpRgMNENnDMfOXEQ8kRQWO2OfRnfgdGgY6e9Ch8+Ym4UDPU2wqRTfnzqP+biYvfZMGDqGNbuK0dQcpRh0W4dSBS91eDG8odXwkjQs+oM5qkPAHJUNm0rR192Awd5mQ4UZUoZOh4bRgQVR+ToeI4TglQ0tsNtUHD1tTEkKfwx2lWLLxlasr3fl/RyREIJNnV5s2dgKuyp+WSFUlkoVDAaa8WJbneGllwmbSrGp04fBgPiSFFqGjZ5K1LlW44+pO4/vlFK4K1fl1Ec8kcRf03eRzHIIUedajeCtKpy/djOnftIhVNbvN27hanA6a7uSFYXY8+6rOfUxF47iyyOnMReOZW2bTSgvQmXFE0nEkX1xGJvPfV+KMSA6H0d0GTFyxRI7pU8LUhYHUhYHUhYHUhYHUhYHUhYHUhYHUhYHUhYHUhYHUhYHUhYHppyDMyDno6tE0vgjr0yYImsuHMWnh07m9N54IolI1JyrR6bISiR1XAneNqPrZSHnLA6kLA6kLA4UJnhT/1lGmbt/1+wcngqikRCUyUvnzM7D8jDGELzyG5SfvvuCxCIhs/OxNNHQLH7+4TBRAODPqxfBBP3n1LMGYzquX5gAkPo0PPrVJ+TuP1OmJmVVpm9O4sfUr0ouueby9gcfsZLy7PfSnwcYY7gzFcTXH+9ZlPGIldfG32dVHh80hzO/2VmIWCSEG5d/xbED+zP/TunDDO18j61e5zE+M4vx9+RlnDj0WVov/wEGuUVdoh/ylgAAAABJRU5ErkJggg==',
image_height : '6%',
image_width : '3%',
scroll_distance : 200,
scroll_location : 0,
scroll_speed : 600,
button_animate_speed : 200,
button_animate_type : 'fade',
position : 'bottom_left'
   };
   var args = defaultOptions;
   if(typeof userOptions === 'object') {
args = $.extend(defaultOptions,userOptions);
}
switch(args.position) {
case 'top_left':
var css = 'top:0;left:0;';
break;
case 'top_right':
var css = 'top:0;right:0;';
break;
case 'bottom_right':
var css = 'bottom:0;right:0;';
break;
case 'center':
var css = 'top:50%;bottom:50%;left:50%;right:50%;';
break;
default:
var css = 'bottom:0;left:0;';
}
css += 'margin–bottom:5px;margin–top:5px;margin–left:5px;margin–right:5px;display:none;position:fixed;height:' + args.image_height + ';width:' + args.image_width + ';cursor:pointer;';
$('body').append('');
$(window).scroll(function() {
if($(this).scrollTop() > args.scroll_distance) {
switch(args.button_animate_type) {
case 'slide' :
$('#scroll_to_top').slideDown(args.button_animate_speed);
break;
default:
$('#scroll_to_top').fadeIn(args.button_animate_speed);
}
       } else {
switch(args.button_animate_type) {
case 'slide' :
$('#scroll_to_top').slideUp(args.button_animate_speed);
break;
default:
$('#scroll_to_top').fadeOut(args.button_animate_speed);
}
       }
if(check_scroll === 1) {
if($(this).scrollTop() === 0) {
if(typeof args.success != "undefined") {
args.success();
check_scroll = 0;
}
}
}
});
$('#scroll_to_top').click(function() {
$('body,html').animate({
scrollTop : args.scroll_location
}, args.scroll_speed);
check_scroll = 1;
});
};[CODE]

And here's how to use it – (example.html)
[CODE]


































































[CODE]

TAGS: javascript