scroll イベントの拡張プラグインメモ
- スクロールイベントが X/Y 方向か判別可能
- スクロール開始、スクロール中、スクロール終了時にイベント割当が可能
(function($j){ $j.ex = $j.ex || {}; $j.ex.scrollEvent = function( target , callback ){ var tm = 0, status = 0 , param , pos; var setPosition = function(){ pos = { top : target.scrollTop(), left : target.scrollLeft() } } setPosition(); target.scroll( function(){ status = status == 0 ? 1 : 2; if( tm ) clearTimeout( tm ); tm = setTimeout( function(){ tm = 0; setPosition(); param.status = status = 0; callback( param ); } , 100); if( status != 0){ callback(param = { status : status, scrollY : pos.top != target.scrollTop(), scrollX : pos.left != target.scrollLeft() }); } }); } $j.fn.exScrollEvent = function( callback ){ var targets = this; return targets.each(function(idx){ new $j.ex.scrollEvent( targets.eq(idx) , callback ); }); } })(jQuery);
使い方
$(window).exScrollEvent(function(pa){ //Y方向時のみ if(pa.scrollY){ if(pa.status == 1){ //スクロール開始時 } else if (pa.status == 0) { //スクロール終了時 } else if (pa.status == 2) { //スクロール中 } } });