位置：首页>> 网络编程>> JavaScript>> 百度百科的图片轮播代码

百度百科的图片轮播代码

　来源：asp之家　发布时间：2009-05-06 12:58:00　

标签：百度,图片,轮播,代码

从百度百科中扣去的这个图片轮播代码，图片向左不间断滚动，有停顿：

<!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>图片轮播-aspxhome.com</title><style>#looou{height:120px;overflow:hidden;width:800px; }a{font-size:12px;color:#666;text-decoration:none;}a:hover{color:#CC0000;text-decoration:underline; }img{border:none}#holder1,#holder1 li{margin:0;padding:0;list-style-type:none;font-size:12px;}#holder1{white-space:nowrap;}#holder1 li{width:78px;height:78px;margin-left:10px; display: -moz-inline-stack; display: inline-block; zoom: 1; *display: inline; }#holder1 li div{width:76px;height:78px;overflow:hidden;vertical-align:middle;display:inline-block;line-height:78px;font-size:50px;border:1px solid #aaa; }#holder1 li img {vertical-align:middle; }#holder1 h4{text-align:center; }</style></head><body><div id="looou"> <ul id="holder1"><li><div><a href="http://zidian.aspxhome.com" target="_blank"><img name="slidepic" src="http://zidian.aspxhome.com/images/zidian.gif" width="78" alt="在线字典 " title="在线字典 "></a></div><h4><a href="http://zidian.aspxhome.com" target="_blank" name="pftitle" title="在线字典 ">在线字典</a></h4></li><li><div><a href="http://www.aspxhome.com" target="_blank"><img name="slidepic" src="https://www.aspxhome.com/images/logo.gif" width="78" alt="asp之家 " title="asp之家鱼 "></a></div><h4><a href="http://www.aspxhome.com" target="_blank" name="pftitle" title="asp之家 ">asp之家 </a></h4></li><li><div><a href="http://www.cidianwang.com" target="_blank"><img name="slidepic" src="http://www.cidianwang.com/images/logo.gif" width="78" alt="连连看游戏网 " title="连连看游戏网 "></a></div><h4><a href="http://www.cidianwang.com" target="_blank" name="pftitle" title="连连看游戏网">连连看游戏网 </a></h4></li><li><div><a href="http://zidian.aspxhome.com" target="_blank"><img name="slidepic" src="http://zidian.aspxhome.com/images/zidian.gif" width="78" alt="在线字典 " title="在线字典 "></a></div><h4><a href="http://zidian.aspxhome.com" target="_blank" name="pftitle" title="在线字典 ">在线字典</a></h4></li><li><div><a href="http://www.aspxhome.com" target="_blank"><img name="slidepic" src="https://www.aspxhome.com/images/logo.gif" width="78" alt="asp之家 " title="asp之家鱼 "></a></div><h4><a href="http://www.aspxhome.com" target="_blank" name="pftitle" title="asp之家 ">asp之家 </a></h4></li><li><div><a href="http://www.cidianwang.com" target="_blank"><img name="slidepic" src="http://www.cidianwang.com/images/logo.gif" width="78" alt="连连看游戏网 " title="连连看游戏网 "></a></div><h4><a href="http://www.cidianwang.com" target="_blank" name="pftitle" title="连连看游戏网">连连看游戏网 </a></h4></li><li><div><a href="http://zidian.aspxhome.com" target="_blank"><img name="slidepic" src="http://zidian.aspxhome.com/images/zidian.gif" width="78" alt="在线字典 " title="在线字典 "></a></div><h4><a href="http://zidian.aspxhome.com" target="_blank" name="pftitle" title="在线字典 ">在线字典</a></h4></li><li><div><a href="http://www.aspxhome.com" target="_blank"><img name="slidepic" src="https://www.aspxhome.com/images/logo.gif" width="78" alt="asp之家 " title="asp之家鱼 "></a></div><h4><a href="http://www.aspxhome.com" target="_blank" name="pftitle" title="asp之家 ">asp之家 </a></h4></li><li><div><a href="http://www.cidianwang.com" target="_blank"><img name="slidepic" src="http://www.cidianwang.com/images/logo.gif" width="78" alt="连连看游戏网 " title="连连看游戏网 "></a></div><h4><a href="http://www.cidianwang.com" target="_blank" name="pftitle" title="连连看游戏网">连连看游戏网 </a></h4></li></ul></div><script type="text/javascript">window.onload=function(){var jay=document.getElementById('looou'),z=10;var inner=document.getElementById("holder1");var len=inner.getElementsByTagName('LI').length;var w=78+10;inner.innerHTML+=inner.innerHTML;(function (){if(jay.scrollLeft==w*len) jay.scrollLeft=0;jay.scrollLeft+=Math.ceil((w-jay.scrollLeft％w)*0.15);z=jay.scrollLeft％w==0?2000:10;setTimeout(arguments.callee,z);})();}</script></body></html>

投稿

百度百科的图片轮播代码

猜你喜欢