圖片首尾相接無縫滾動實例代碼（向左/向右）

前幾天遇到一個圖片滾動的問題，平實寫的滾動都是一次滾動，首位不想接，下面的例子能夠解決這個問題，首尾無縫相接滾動，能夠向左滾動，也能夠向右滾動。下面就是例子的代碼。 圖片省略，樣式省略。

更多詳情實例請訪問 http://www.walkerjava.com/thread-153-1-1.html

HTML代碼

< div id ="colee_right" style ="white-space: nowrap; overflow: hidden;" >
< table cellpadding ="0" cellspacing ="0" border ="0" style ="border: none;" >
< tr >
< td id ="colee_right1" valign ="top" align ="center" style ="border: none;" >
< table class ="rolltable" cellpadding ="0" cellspacing ="0" border ="0" style ="border: none;" >
< tr align ="center" >
< td >
< img class ="title_img" src ="p_w_picpaths/new_dedecms.gif" title ="織夢內容管理系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_discuz.gif" title ="Discuz!社區論壇" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_phpcms.gif" title ="phpcms內容管理系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_dvbbs.gif" title ="動網論壇" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_ecms.gif" title ="帝國管理系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_shopex.gif" title ="shopex專業網店系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_joekoe.gif" title ="喬客內容管理系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_phpwind.gif" title ="phpwind內容管理系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_pjblog.gif" title ="中文我的博客系統程序" />
</td>
< td >
< img class ="title_img" src ="p_w_picpaths/new_oblog.gif" title ="oblog博客系統" />
</td>
< td >
< img class ="title_img" src ="p_w_picpathsnew_dvnet.gif" title ="動網內容管理系統" />
</td>
</tr>
</table>
</td>
< td id ="colee_right2" valign ="top" style ="border: none;" > </td>
</tr>
</table>
</div>

javascript代碼

var speed = 30
//速度數值越大速度越慢
var colee_right2 = document.getElementById( "colee_right2");
var colee_right1 = document.getElementById( "colee_right1");
var colee_right = document.getElementById( "colee_right");
colee_right2.innerHTML = colee_right1.innerHTML;
function Marquee4() {
// 控制從右向左滾動
if (colee_right.scrollLeft >= colee_right2.offsetWidth)
colee_right.scrollLeft = 0;
else {
colee_right.scrollLeft++;
}
// 控制從左向右滾動
/*
if (colee_right.scrollLeft <= 0)
colee_right.scrollLeft += colee_right2.offsetWidth;
else {
colee_right.scrollLeft--;
}*/
}
var MyMar4 = setInterval(Marquee4, speed);
colee_right. = function() {
clearInterval(MyMar4);
}
colee_right. = function() { MyMar4 = setInterval(Marquee4, speed); }