減速しながらスクロールする
<html>
<head>
<title>減速しながらスクロールする</title>
<script language="JavaScript">
<!--
function slowdownScroll() {
if(navigator.appName == "Microsoft Internet Explorer" && document.compatMode == "CSS1Compat") {
sctop = document.body.parentNode.scrollTop;
}
else if(window.pageYOffset){
sctop = window.pageYOffset;
} else {
sctop = document.body.scrollTop;
}
if(sctop){
scup = Math.ceil(sctop*.2);
scrollBy(0,-scup);
if (sctop-scup) setTimeout("slowdownScroll()",20);
}
}
//-->
</script>
</head>
<body>
<br>
・
・
・
・
<a href="JavaScript:scrollTo(0,0)" onclick="slowdownScroll();return false;">▲ページのトップへ戻る</a>
</body>
</html>
※ページ下部からページの最上部に戻るとき、減速しながら、ページの最上部でぴったりと止まるようにスクロールします。
スクロールの最上部位置を取得します。
document に scrollTop というプロパティがありますが、NN4 では無効なので、
window のプロパティ pageYOffset を使用します。これはスクロールされているときに、
画面に表示されているページの縦位置を返します。
if(sctop){
scup = Math.ceil(sctop*.2);
scrollBy(0,-scup);
if (sctop-scup) setTimeout("slowdownScroll()",20);
}
スクロールの位置が０（ページ最上部）でない場合、スクロールさせる分（scup）を取得します。
スクロールの最上部位置（＝スクロールする残り分）×0.2 を端数を切り上げ、ページ上部にその分
スクロールさせます。
ページの最上部に到達するまで、20 ミリ秒後とにこの関数を再実行します。
ホームページ作成ガイド
ホームページ作成ガイド