jQuery scrollTo

by bizamajig

HTML

<a class="bizamajig-scroll" href="page-1">Page-1</a>
<a class="bizamajig-scroll" href="page-2">Page-2</a>

<div id="page-1">Page-1</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<div id="page-2">Page-2</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />

CSS

a {color: #000; padding: 10px;}
#page-1 {margin-top: 500px; background: #333; color: #fff;}
#page-2 {margin-top: 500px; background: #009cff; color: #fff;}

JavaScript

/**
 * jQuery.ScrollTo
 * Copyright (c) 2007-2009 Ariel Flesler - aflesler(at)gmail(dot)com | http://flesler.blogspot.com
 * Dual licensed under MIT and GPL.
 * Date: 5/25/2009
 *
 * @projectDescription Easy element scrolling using jQuery.
 * http://flesler.blogspot.com/2007/10/jqueryscrollto.html
 * Works with jQuery +1.2.6. Tested on FF 2/3, IE 6/7/8, Opera 9.5/6, Safari 3, Chrome 1 on WinXP.
 *
 * @author Ariel Flesler
 * @version 1.4.2
 *
 * @id jQuery.scrollTo
 * @id jQuery.fn.scrollTo
 * @param {String, Number, DOMElement, jQuery, Object} target Where to scroll the matched elements.
 *      The different options for target are:
 *        - A number position (will be applied to all axes).
 *        - A string position ('44', '100px', '+=90', etc ) will be applied to all axes
 *        - A jQuery/DOM element ( logically, child of the element to scroll )
 *        - A string selector, that will be relative to the element to scroll ( 'li:eq(2)', etc )
 *        - A hash { top:x, left:y }, x and y can be any kind of number/string like above.
*        - A percentage of the container's dimension/s, for example: 50% to go to the middle.
 *        - The string 'max' for go-to-end. 
 * @param {Number} duration The OVERALL length of the animation, this argument can be the settings object instead.
 * @param {Object,Function} settings Optional set of settings or the onAfter callback.
 *     @option {String} axis Which axis must be scrolled, use 'x', 'y', 'xy' or 'yx'.
 *     @option {Number} duration The OVERALL length of the animation.
 *     @option {String} easing The easing method for the animation.
 *     @option {Boolean} margin If true, the margin of the target element will be deducted from the final position.
 *     @option {Object, Number} offset Add/deduct from the end position. One number for both axes or { top:x, left:y }.
 *     @option {Object, Number} over Add/deduct the height/width multiplied by 'over', can be { top:x, left:y } when using both axes.
 * ...