# jQuery ScrollTo - Smooth scroll to any jQuery/DOM element

## Download

## Demo Page

## Project Page

## Bug Tracker

Vote on HN
Tweet
Follow @balupton

## About

jQuery ScrollTo is a great way to smooth scroll to any jQuery/DOM element

- Extremely simple to use: just call `$('#element).ScrollTo()` and your user will be smoothly scrolled to that element!
- Only 1KB in size! Making it the smallest ScrollTo plugin and won't slow you down.
- Supports all the elements you can throw at it! Even those ones in modals and scrollable areas! So you can now feel at ease knowing your user will always be scrolled to that correct place which you intended.
- It's even easy customise and work with! You can specify such options as `duration`, `easing`, and `callback` on your ScrollTo call.

Enough talk, let's see it in action!

## Using

Loading... please wait
#scrollto1:

    $('#scrollto1').ScrollTo();

#scrollto2

    $('#scrollto2').ScrollTo({
        duration: 2000,
        easing: 'linear'
    });

#scrollto3

    $('#scrollto3').ScrollTo({
        duration: 2000,
        durationMode: 'all'
    });

#scrollto4

    $('#scrollto4').ScrollTo({
        duration: 2000,
        callback: function(){
            alert('Scrolling has now completed.');
        }
    });

#scrollto5

    $('#scrollto5').ScrollTo();

#scrollto6

    $('#scrollto6').ScrollTo({
        onlyIfOutside: true
    });

## Installation

### Step 1. Download jQuery ScrollTo, and extract it to your hard drive

As everyones extraction process is a little bit different be sure of the following:

- If the archive was extracted and you have a whole bunch of files and directories (folders), then you must create a new directory called `jquery-scrollto` and move all the files and directories into that to continue.
- If the archive was extracted and you have only one directory called `jquery-scrollto` which has a whole bunch of stuff in it, then that is fine and you can continue onto the next step.
- If the archive was extracted and you have only one directory and it is not called `jquery-scrollto` then you must rename it to `jquery-scrollto` to continue.

### Step 2. Move the `jquery-scrollto` directory to somewhere on your webserver

Be sure to always keep the entire `jquery-scrollto` directory intact; this means if you were to only move some of the files instead of moving the entire directory, then you would run into problems due to the cross directory references would no longer be working.

### Step 3. Include jQuery (insert into your page's head tag)

If your page already has jQuery included then you can skip this step.

    <!-- Include jQuery (Dependency of jQuery ScrollTo) -->
    <script src="http://www.yoursite.com/somewhere/on/your/webserver/jquery-scrollto/vendor/jquery.js"></script>

### Step 4. Include jQuery ScrollTo (insert into your page's head tag)

    <!-- Include jQuery ScrollTo -->
    <script src="http://www.yoursite.com/somewhere/on/your/webserver/jquery-scrollto/lib/jquery-scrollto.js"></script>

## Enjoy!!!

If anything isn't working the way you want it to, or if you would like to request a feature or provide praise or general feedback then be sure to click the feedback button to the right, or the "Get Support" link up the top of this page.

This work is powered by coffee and distributed for free. Donations are how we afford our coffee. Coffee is how we stay awake after our day job hours to work on things like this free open-source project which you're looking at. So go ahead, and get that warm fuzzy feeling knowing you just helped some poor fellow working after hours for free to buy his coffee. You only need to spare a few dollars, or as much as you feel this piece of work is worth. Thanks so much. Alternatively; if you are not in a donating mood, then spreading the word about this project on twitter, your blog, or whatever is just as good. You can also give praise by clicking the feedback button or visiting our "Get Support" link. Thanks a bunch, we appreciate the help deeply.

Licensed under the MIT License.