ScrollUp is a lightweight jQuery plugin to create a “Scroll to top” feature that will work with any website, with ease. ScrollUp is fully customisable through CSS which makes it simple to fit right into your project – simply target the scrollUp’s generated ID in your CSS file and set your styles and you are good to go.

Scroll to Top Jquery Plugin

Scroll to Top Jquery Plugin

How to use

Simply include the jquery.scrollUp.min.js file and place the following in the head of your document (make sure jQuery is included):

$(function () {
    $.scrollUp({
        scrollName: 'scrollUp', // Element ID
        topDistance: '300', // Distance from top before showing element (px)
        topSpeed: 300, // Speed back to top (ms)
        animation: 'fade', // Fade, slide, none
        animationInSpeed: 200, // Animation in speed (ms)
        animationOutSpeed: 200, // Animation out speed (ms)
        scrollText: 'Scroll to top', // Text for element
        activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
    });

});

 

activeOverlay

To create a visible line to help determin an ideal scroll distance from the top, assign a valid CSS colour to the activeOverlay setting. This could be HEX, HSLA or RGB(A). Example: activeOverlay: '#00FFFF'See the demo for an example.

ScrollUp is fully customisable through CSS which makes it simple to fit right into your project. Simply target the scrollUp’s generated ID in your CSS file and set your styles

Download

If you enjoyed this article, Get email updates (It’s Free)
http://w3lessons.info/wp-content/uploads/2013/02/scroll-to-top-jquery-plugin.jpghttp://w3lessons.info/wp-content/uploads/2013/02/scroll-to-top-jquery-plugin-150x150.jpgKarthikeyan KFreebiesjqueryjquery plugin,scroll div
ScrollUp is a lightweight jQuery plugin to create a “Scroll to top” feature that will work with any website, with ease. ScrollUp is fully customisable through CSS which makes it simple to fit right into your project – simply target the scrollUp’s generated ID in your CSS file and set your styles...