先看效果图：
原文件：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>超级经典一套鼠标控制左右滚动图片带自动翻滚</title>
<script type="text/javascript" src="js/scroll.v.1.2.js"></script>
</head>
<body>
<!--begin-->
<div class="rollBox">
<div class="LeftBotton" onmousedown="ISL_GoUp()" onmouseup="ISL_StopUp()" onmouseout="ISL_StopUp()"></div>
<div class="Cont" id="ISL_Cont">
<div class="ScrCont">
<div id="List1">
<!-- 图片列表begin -->
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/15.html" target="_blank"><img src="http://i0.sinaimg.cn/edu/deco/2007/0928/aiying.jpg" width="109" height="87" alt="周宪环" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/15.html" target="_blank">周宪环</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/16.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/zhenwei.jpg" width="109" height="87" alt="周桢炜" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/16.html" target="_blank">周桢炜</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/14.html" target="_blank"><img src="http://i2.sinaimg.cn/edu/deco/2007/0928/zhangying.jpg" width="109" height="87" alt="张颖" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/14.html" target="_blank">张颖</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/17.html" target="_blank"><img src="http://i3.sinaimg.cn/edu/deco/2007/0928/wangnaichao.jpg" width="109" height="87" alt="王乃超" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/17.html" target="_blank">王乃超</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/19.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/xiewenxiu.jpg" width="109" height="87" alt="谢雯琇" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/19.html" target="_blank">谢雯琇</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0928/18.html" target="_blank"><img src="http://i1.sinaimg.cn/edu/deco/2007/0928/lvge.jpg" width="109" height="87" alt="吕铬" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0928/18.html" target="_blank">吕铬</a></p>
</div>
<div class="pic">
<a href="http://career.sina.com.cn/3/2007/0927/12.html" target="_blank"><img src="http://i2.sinaimg.cn/edu/deco/2007/0928/zhengru.jpg" width="109" height="87" alt="贾正如" /></a>
<p><a href="http://career.sina.com.cn/3/2007/0927/12.html" target="_blank">贾正如</a></p>
</div>
<!-- 图片列表end -->
</div>
<div id="List2"></div>
</div>
</div>
<div class="RightBotton" onmousedown="ISL_GoDown()" onmouseup="ISL_StopDown()" onmouseout="ISL_StopDown()"></div>
</div>
<style type="text/css">
<!--
.rollBox{ width:704px;overflow:hidden;padding:12px 0 5px 6px;}
.rollBox .LeftBotton{ height:52px;width:19px;background:url(http://i3.sinaimg.cn/edu/deco/2007/0924/career/job_mj_069.gif) no-repeat 11px 0;overflow:hidden;float:left;display:inline;margin:25px 0 0 0;cursor:pointer;}
.rollBox .RightBotton{ height:52px;width:20px;background:url(http://i3.sinaimg.cn/edu/deco/2007/0924/career/job_mj_069.gif) no-repeat -8px 0;overflow:hidden;float:left;display:inline;margin:25px 0 0 0;cursor:pointer;}
.rollBox .Cont{ width:663px;overflow:hidden;float:left;}
.rollBox .ScrCont{ width:10000000px;}
.rollBox .Cont .pic{ width:132px;float:left;text-align:center;}
.rollBox .Cont .pic img{ padding:4px;background:#fff;border:1px solid #ccc;display:block;margin:0 auto;}
.rollBox .Cont .pic p{ line-height:26px;color:#505050;}
.rollBox .Cont a:link,.rollBox .Cont a:visited{ color:#626466;text-decoration:none;}
.rollBox .Cont a:hover{ color:#f00;text-decoration:underline;}
.rollBox #List1,.rollBox #List2{ float:left;}
-->
</style>
最低0.47元/天 解锁文章
1661
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
