Re: 卷屏,滚动代码
[code]<style type="text/css"><!--
ul, li, img, td {
margin:0;
padding:0;
font-size:12px;
list-style-type:none;
text-align:center;
}
.demo {
width:230px;
margin-bottom: 8px;
height: 172px;
overflow: hidden;
}
.demo ul {
width:408px;
clear:both;
}/*102*4=408px等于实际内容的总宽度*/
.demo li {
width:102px;
float:left;
text-align:center;
}
.demo img {
margin-bottom:8px;
}
--></style>
<div class="demo" id="demo1">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<ul>
<li><br>滚动内容1 有间隔</li>
<li><br>滚动内容2 有间隔</li>
<li><br>滚动内容3 有间隔</li>
<li><br>滚动内容4 有间隔</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<div class="demo" id="demo2">
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<ul>
<li><br>滚动内容1</li>
<li><br>滚动内容2</li>
<li><br>滚动内容3</li>
<li><br>滚动内容4</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript" language="JavaScript">// <![CDATA[
function startmarquee(lh,speed,delay,index){
var o=document.getElementById("demo"+index);
var o_td=o.getElementsByTagName("td")[0];
var str=o_td.innerHTML;
var newtd=document.createElement("td");
newtd.innerHTML=str;
o_td.parentNode.appendChild(newtd);
var t;
var p=false;
o.onmouseover=function(){p=true;}
o.onmouseout=function() {p=false;}
function start(){
t=setInterval(Marquee,speed);
if(!p){o.scrollLeft += 3;}
}
function Marquee(){
if(o_td.offsetWidth-o.scrollLeft<=0)
o.scrollLeft-=o_td.offsetWidth;
else{
if(o.scrollLeft%lh!=0){
o.scrollLeft+= 3
}else{clearInterval(t); setTimeout(start,delay);}
}
}
setTimeout(start,delay);
}
startmarquee(102,1,1500,1);
startmarquee(102,30,1,2);
// ]]></script> [/code]