主题:请教图片滚动问题?
大家好!下面的代码可以让图片间隔滚动..
但是每一次他也要滚..
能不能让他第一次不要直接滚动..停留一会再滚动...
大虾们帮我看看吧!或是有同样效果的代码也可以..谢谢
<div id="article1" style="width:530px;height:204px !important;height:121px;" >
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
</div>
<div id="article2" style="position:absolute;z-index:1;visibility:hidden"></div>
<script>
articleHeight=120;
stopscrolla=false;
article1.scrollTop=1;
with(article1){
style.width=0;
style.height=articleHeight;
style.overflowX="visible";
style.overflowY="hidden";
noWrap=true;
onmouseover=new Function("stopscrolla=true");
onmouseout=new Function("stopscrolla=false");
}
preTopa=0; currentTopa=0; stoptimea=0;
function init_srolltext1(){
article2.innerHTML="";
article2.innerHTML+=article1.innerHTML;
article1.innerHTML=article2.innerHTML+article2.innerHTML;
setInterval("scrollUp1()",16);
}
function scrollUp1(){
if(stopscrolla==true) return;
currentTopa+=1;
if(currentTopa==121)
{
stoptimea+=1;
currentTopa-=1;
if(stoptimea==90)
{
currentTopa=0;
stoptimea=0;
}
}
else {
preTopa=article1.scrollTop;
article1.scrollTop+=1;
if(preTopa==article1.scrollTop){
article1.scrollTop=article2.offsetHeight-articleHeight;
article1.scrollTop+=1;
}
}
}
init_srolltext1();
</script>
但是每一次他也要滚..
能不能让他第一次不要直接滚动..停留一会再滚动...
大虾们帮我看看吧!或是有同样效果的代码也可以..谢谢
<div id="article1" style="width:530px;height:204px !important;height:121px;" >
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_1_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_2_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
<table width="100" border="0" cellspacing="0" cellpadding="0">
<tr>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_01.jpg" alt="" width="103" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_02.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_03.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_04.jpg" alt="" width="106" height="120" border="0"></a></td>
<td><a href="#" target="_blank"><img src="/images/product_banner_3_05.jpg" alt="" width="109" height="120" border="0"></a></td>
</tr>
</table>
</div>
<div id="article2" style="position:absolute;z-index:1;visibility:hidden"></div>
<script>
articleHeight=120;
stopscrolla=false;
article1.scrollTop=1;
with(article1){
style.width=0;
style.height=articleHeight;
style.overflowX="visible";
style.overflowY="hidden";
noWrap=true;
onmouseover=new Function("stopscrolla=true");
onmouseout=new Function("stopscrolla=false");
}
preTopa=0; currentTopa=0; stoptimea=0;
function init_srolltext1(){
article2.innerHTML="";
article2.innerHTML+=article1.innerHTML;
article1.innerHTML=article2.innerHTML+article2.innerHTML;
setInterval("scrollUp1()",16);
}
function scrollUp1(){
if(stopscrolla==true) return;
currentTopa+=1;
if(currentTopa==121)
{
stoptimea+=1;
currentTopa-=1;
if(stoptimea==90)
{
currentTopa=0;
stoptimea=0;
}
}
else {
preTopa=article1.scrollTop;
article1.scrollTop+=1;
if(preTopa==article1.scrollTop){
article1.scrollTop=article2.offsetHeight-articleHeight;
article1.scrollTop+=1;
}
}
}
init_srolltext1();
</script>