スムーズスクロール jQuery Plugin

jquery.smartScroll.js

////////////////////////////////////////////////////////////////////////////////
// Smart scroll - jQuery Plugin
// ページをまたいで作動するスムーズスクロール
//
// Copyright 2010, Minoru Nakanow
// Licensed under the MIT licenses.
// http://www.opensource.org/licenses/mit-license.html
// 
// Usage:
// $("a[href^='#']:not([target])").pageScroll();
// $("a[href*='#'][href*='.']:not([target])").overScroll();
// 
////////////////////////////////////////////////////////////////////////////////
(function($) {
	//--------------------------------------------------------------------------
	//  Variables
	//--------------------------------------------------------------------------
	//ホイールイベント
	var _wheelEvent = _wheelEventType();
	
	//--------------------------------------------------------------------------
	//  jQuery extend 
	//--------------------------------------------------------------------------
	jQuery.fn.extend({
		/**
		 * ページ内スムーズスクロール
		 * 
		 * @requires jquery.easing.js
		 * @param {Number} speed	処理時間 (初期値: 1000)
		 * @param {String} easing	イージング (初期値: "easeOutExpo")
		 * @return {jQuery}
		 */
		pageScroll: function (speed, easing) {
			speed = speed || 1000;
			easing = easing || "easeOutExpo";
			
			return this.each(function() {
				$(this).click(function() {
					var hash = this.hash;
					if(!$(hash).length) return;
					var arrive = _scaler(hash);
					_scrollerAddCancel();
					
					$("html, body").animate(
						{scrollTop: arrive},
						speed,
						easing,
						function() {
							document.location.hash = hash;
							_scrollerRemove();
						}
					);
					return false;
				});
			});
		},
		
		/**
		 * ページをまたいだスムーズスクロール
		 * 
		 * @requires jquery.cookie.js
		 * @requires jquery.easing.js
		 * @param {Number} speed	処理時間 (初期値: 1000)
		 * @param {String} easing	イージング (初期値: "easeOutExpo")
		 * @param {Number} delay	ページ遷移後、スクロール開始までの待機時間 (初期値: 500)
		 * @param {String} cooky	クッキー名 (初期値: "overscroll")
		 * @return {jQuery}
		 */
		overScroll: function (speed, easing, delay, cooky) {
			speed = speed || 1000;
			easing = easing || "easeOutExpo";
			delay = delay || 500;
			cooky = cooky || "overscroll";
			
			var target = $.cookie(cooky);
			$.cookie(cooky, null);
			
			if(target && $(target).length) {
				var arrive = _scaler(target);
				setTimeout(function() {
					_scrollerAddCancel();
					
					$("html, body").animate(
						{scrollTop: arrive},
						speed,
						easing,
						function() {
							document.location.hash = target;
							_scrollerRemove();
						}
					);
				}, delay);
			} else if(target) {
				document.location.hash = target;
			};
			
			return this.each(function() {
				$(this).click(function() {
					if(this.hostname == document.location.hostname) {
						$.cookie(cooky, this.hash);
						document.location = this.href.split("#")[0];
						return false;
					}
				});
			});
		}
	});
	
	//--------------------------------------------------------------------------
	//  Private methods
	//--------------------------------------------------------------------------
	/**
	 * 対象位置の測定
	 * 
	 * @param {String} hash	#ID
	 * @return {Number}
	 */
	function _scaler(hash) {
		if(!$(hash).length) return false;
		var target = $(hash).offset().top;
		var dh = $(document).height();
		var wh = $(window).height();
		
		return (dh - target <= wh) ? dh - wh : target;
	}
	
	/**
	 * ホイールイベントの判定
	 */
	function _wheelEventType() {
		var eventType = "onmousewheel";
		if($.browser.mozilla) eventType = "DOMMouseScroll";
		else if($.browser.safari) eventType = "mousewheel";
		return eventType;
	}
	
	/**
	 * スムーズスクロールの停止
	 */
	function _scrollerStop() {
		$("html, body").stop();
		_scrollerRemove();
	}
	
	/**
	 * ホイールイベントでスクローラー停止
	 */
	function _scrollerAddCancel() {
		if(document.addEventListener) document.addEventListener(_wheelEvent, _scrollerStop, false);
		else document.attachEvent(_wheelEvent, _scrollerStop);
	}
	
	/**
	 * ホイールイベントハンドラを削除
	 */
	function _scrollerRemove() {
		if(document.removeEventListener) document.removeEventListener(_wheelEvent, _scrollerStop, false);
		else document.detachEvent(_wheelEvent, _scrollerStop);
	}
	
})(jQuery);