- 441 名前：440 mailto:sage [2009/06/22(月) 15:53:01 ID:5Kip+EZh0]
- 超手抜きだけど、具体的にはこんな感じ。
<html><head><meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"></head><body>
<script type="text/javascript">
var tw=160,th=120,tc=3,tr=2; //サムネイル幅,高,横枚数,縦枚数
var gInterval; //タイマー変数
function nextimg(id){
var el = document.getElementById(id);
var eleft = parseInt(el.style.left.replace("px",""));
var etop = parseInt(el.style.top.replace("px",""));
if( eleft > (-tw*(tc-1)) ){
eleft -= tw;
} else if( etop > (-th*(tr-1)) ){
eleft = 0;
etop -= th;
} else {
eleft = 0;
etop = 0;
}
el.style.top = etop + "px";
el.style.left = eleft + "px";
}
function initimg(id){
window.clearInterval(gInterval);
var el = document.getElementById(id);
el.style.top = "0px";
el.style.left = "0px";
}
</script>
<div style="width:160px;height:120px;overflow:hidden">
<img id="img1" src="hoge.jpg" onmouseover="gInterval=window.setInterval('nextimg(\''+this.id+'\')',1000);" onmouseout="initimg(this.id)" style="position:absolute;top:0px;left:0px"></div>
</body></html>
|
 |
