2007/10/11

Java スクロール

ヘッダーに定義
例えば
<script src="js/scroll_top.js" type="text/javascript"></script>
<a href="javascript:void(0);" onclick="scroller(0,0,100);return false;" onfocus="if(this.blur)this.blur()">▲</a>


ソースもついでに貼っとこう
// 現在のスクロール量を取得(汎用)
function getScroll(){
var x, y ;
if( document.all !== void 0 ){
x = document.body.scrollLeft ;
y = document.body.scrollTop ;
}else if( document.layers !== void 0 ){
x = window.pageXOffset ;
y = window.pageYOffset ;
}else{
x = window.scrollX ;
y = window.scrollY ;
}
return { x : x, y : y };
}

// スクロール始めのスクロール量
var SCROLL ;
var divCountScroller = 15 ; // 分割数(何段階でスクロールするか)

// 現在のスクロール位置から、指定座標(x,y)までスクロールします
// edging は加減速を決めるパラメータで -100〜100 で指定します
// 小さい程加速、大きいほど減速、0のとき等速です
// 最初の呼び出し時、count は指定する必要はありません。
function scroller( x, y, edging, count ){

if( count === void 0 ){
count = 0 ;
SCROLL = getScroll();
}

if( count++ < divCountScroller ){
var c = count/divCountScroller ;
var nx = SCROLL.x+( x-SCROLL.x )*( c+edging/(100*Math.PI)*Math.sin( Math.PI*c ) );
var ny = SCROLL.y+( y-SCROLL.y )*( c+edging/(100*Math.PI)*Math.sin( Math.PI*c ) );
window.scrollTo( nx, ny );
setTimeout( "scroller("+x+","+y+","+edging+","+count+");", 50); // 再描画時間 10[msec] 小さい程早い
}
}