下記のソースでdown.gifにマウスオーバーするとdiv内がスクロールしていきます。
しかし、スクロールが終わってもマウスオーバーしているとずっとyの値が増えてしまいます。
スクロールが終わった時点でyの値も止めたいのですがどうしたらよいでしょうか?
div内の高さが出せればいいような気もするのですが、方法がわかりません。これもあわせてお願いします。
<html>
<head>
<script language="JavaScript">
var timeout;
var y = 0;
var step = 2;
function down(){
if (y < 0){
y=0;
}
document.getElementById("hoge").scrollTop = y;
window.status = y; //テスト用
y = y + step;
timeout=setTimeout("down()",20);
}
function up(){
if (y >=0 ){
document.getElementById("hoge").scrollTop = y;
window.status = y; //テスト用
y = y - step;
}
timeout=setTimeout("up()",20);
}
function stop1(){
clearTimeout(timeout);
}
</script>
</head>
<body>
<img src="up.gif" onMouseOver="up()" onMouseOut="stop1();">
<img src="down.gif" onMouseOver="down()" onMouseOut="stop1();">
<div style="width:150px;height:200px;overflow:hidden;border:1px solid;" id="hoge">
a<br>b<br>c<br>d<br>e<br>f<br>g<br>h<br>i<br>j<br>k<br>l<br>m<br>n<br>
o<br>p<br>q<br>r<br>s<br>t<br>u<br>v<br>w<br>x<br>y<br>z<br>
</div>
</body>
</html>
function down(){ if (y < 0){y=0;} var e=document.getElementById("hoge"); if(e.scrollTop<e.scrollHeight-e.offsetHeight){ e.scrollTop = y; window.status = y; y = y + step; timeout=setTimeout("down()",2); } }
まさにこれです!!
ありがとうございました!!!