javascript控制图片或div层的上下移动滚动效果

2016-10-30 网页编程网 网页编程网

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript控制图片或div层的上下移动滚动效果</title>
</head>
<body>
<a href="javascript: void(0);" onmouseover="ScrollDivUp_T=setInterval(ScrollDivUp,10);" onmouseout="clearInterval(ScrollDivUp_T)">上</a>
<div id="items" style="margin:5px 0px 5px 0px;width:100px;height:200px;border:1px solid #dddddd;overflow:hidden">
 图片1... 
 图片2... 
 图片3... 
 图片4... 
 图片5... 
 图片6... 
 图片7... 
 图片8... 
 图片9... 
 图片10... 
 图片11... 
 图片12... 
 图片13... 
 图片14... 
 图片15... 
 图片16... 
 图片17... 
图片18...
图片19...
 图片20...
</div>
<a href="javascript: void(0);" onmouseover="ScrollDivDown_T=setInterval(ScrollDivDown,10);" onmouseout="clearInterval(ScrollDivDown_T)">下</a>
<script language="javascript">
function ScrollDivUp(){document.getElementById('items').scrollTop -= 1;}
function ScrollDivDown(){document.getElementById('items').scrollTop += 1;}
</script>
</body>
</html>

阅读原文

阅读 3908

123 显示电脑版