向上滚动:
<style>
#dome{ width:300px;height:300px;overflow:hidden;}
</style>
</head>
<body>
<div style="width:1000px;height:1000px;border:1px solid red;">
<div id="dome" >
<div id="dome1" >
<img src="file:///E|/H1102.png" style="width:300px;height:300px;">
</div>
<div id="dome2" >
<div>
</div>
</div>
</body>
</html>
<script>
var dome = document.getElementById("dome");
var dome1 = document.getElementById("dome1");
var dome2 = document.getElementById("dome2");
dome1.style.height = dome.offsetHeight + "px";
dome2.style.height = dome.offsetHeight + "px";
dome2.innerHTML=dome1.innerHTML;
var timer1=window.setInterval(startScroll,40);
function startScroll(){
dome.scrollTop++;
if(dome.scrollTop==dome.offsetHeight){
dome.scrollTop=0;
}
}
dome.οnmοuseοver=function(){
window.clearInterval(timer1);
}
dome.οnmοuseοut=function(){
timer1=setInterval(startScroll,40);
}
</script>
向左滚动:
<style>
#dome{ width:300px;height:300px;overflow:hidden;}
</style>
</head>
<body>
<div style="width:1000px;height:1000px;border:1px solid red;">
<div id="dome" >
<table>
<tr>
<td id="dome1" >
<img src="file:///E|/H1102.png" style="width:300px;height:300px;">
</td>
<td id="dome2" >
</td>
</tr>
</table>
</div>
</div>
</body>
</html>
<script>
var dome = document.getElementById("dome");
var dome1 = document.getElementById("dome1");
var dome2 = document.getElementById("dome2");
dome1.style.width = dome.offsetWidth + "px";
dome2.style.width = dome.offsetWidth + "px";
dome2.innerHTML=dome1.innerHTML;
var timer1=window.setInterval(startScroll,40);
function startScroll(){
dome.scrollLeft++;
if(dome.scrollLeft==dome.offsetWidth){
dome.scrollLeft=0;
}
}
</script>