之前给女性网增加的一个滚动展示

版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://monw3c.blogbus.com/logs/34531035.html

具体展示地址:http://dress.pclady.com.cn/

代码如下:

<!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>
<style>
#marquee_demo a{ text-decoration:none; color:#000000; font-size:12px;}
#marquee_demo a:hover{text-decoration:none; color:#FF99CC; font-size:12px;}
</style>
</head>

<body>
<div class="box985" style="margin-top:12px;">
<div style=" 985px; height:222px; background:url(images/jiepai_bg.jpg) no-repeat 0 0">
<table width="86%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center">&nbsp;</td>
</tr>
<tr>
<td align="center"><div id="marquee_demo" style="overflow:hidden;860px;text-align:center;">
<table cellspacing="0" cellpadding="3" align="center" border="0">
<tr>
<td id="marquee_product1" valign="top">
<table width="880" height="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
<td width="20" align="center">&nbsp;</td>
<td align="center" bgcolor="#efefef"><table width="100%" border="0" cellspacing="4">
<tr>
<td align="center"><a href="#"><img src="images/mm1.jpg" width="100" height="145" border="0"/></a></td>
</tr>
<tr>
<td align="center" style="font-size:12px;"><a href="#">韩国街头美女街拍</a></td>
</tr>
</table></td>
</tr>
</table>
</td>
<td id="marquee_product2" valign="top"></td>
</tr>
</table>
</div>
<script type="text/javascript">
var speed=30;
marquee_product2.innerHTML=marquee_product1.innerHTML;
function Marquee(){
if(marquee_demo.scrollLeft>=marquee_product1.scrollWidth){
marquee_demo.scrollLeft=0;
}
else{
marquee_demo.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
marquee_demo.onmouseover=function(){clearInterval(MyMar);}
marquee_demo.onmouseout=function(){MyMar=setInterval(Marquee,speed);}
</script></td>
</tr>
</table>
</div>
</div>
</body>
</html>


原文地址:https://www.cnblogs.com/luluping/p/1389673.html