借鉴了博客园上
http://www.cnblogs.com/blueSkys/archive/2010/03/15/1686476.html
该博主的滚动图片代码。
修改了一个div版本了，向左滚动图片代码：
<html>
<head>
<title></title>
</head>
<body>
<!--下面是向左滚动代码-->
<div id="colee_left" style="overflow:hidden;400px;"> //400px为图片宽度
<div style="2400px;"> //2400px为三张图片宽度的两倍，尽量大
<div id="colee_left1" style="float:left;display:inline;"> //为了跟colee_left2放在同一行
<div style="float:left;"><img src="a.jpg"></div>
<div style="float:left;"><img src="a.jpg"></div>
<div style="float:left;"><img src="a.jpg"></div>
</div>
<div id="colee_left2" style="float:left;display:inline;"></div> //为了跟colee_left1放在同一行
</div>
</div>
<script>
//使用div时，请保证colee_left2与colee_left1是在同一行上.
var speed=10//速度数值越大速度越慢
var colee_left2=document.getElementById("colee_left2");
var colee_left1=document.getElementById("colee_left1");
var colee_left=document.getElementById("colee_left");
colee_left2.innerHTML=colee_left1.innerHTML
function Marquee3(){
if(colee_left2.offsetWidth-colee_left.scrollLeft<=0)//offsetWidth 是对象的可见宽度
colee_left.scrollLeft-=colee_left1.offsetWidth//scrollWidth 是对象的实际内容的宽，不包边线宽度
else{
colee_left.scrollLeft++
}
}
var MyMar3=setInterval(Marquee3,speed)
colee_left.onmouseover=function() {clearInterval(MyMar3)}
colee_left.onmouseout=function() {MyMar3=setInterval(Marquee3,speed)}
</script>
</body>
</html>
jquery 的代码实现：
如果你是用后台生成的代码，并且滚动的图片不只是一份，比如有一个tab标签做的切换，然后没个标签里的内容都是滚动图片
并且存在每个标签里的内容的HTML结构都一致的，这是，我们可以使用这样的jquery:
<script type="text/javascript">
$(function(){
$.each($('#tab_conbox2_foot').children('li'),function(i,obj){
marqueePredo(i,obj);
});
function marqueePredo(i,liObj)
{
//使用div时，请保证colee_left2与colee_left1是在同一行上
var speed=10//速度数值越大速度越慢
var colee_left=jQuery(liObj);
var colee_left2=colee_left.children().children(".tabimg2");//.children("tabimg2");
var colee_left1=colee_left.children().children(".tabimg");//.children("tabimg");
colee_left2.html(colee_left1.html());
var Marquee3=function(){
//alert(5);
//alert(colee_left2.width());
//alert(colee_left.scrollLeft());
if(colee_left2.width()-colee_left.scrollLeft()<=0)//offsetWidth 是对象的可见宽度
{
colee_left.scrollLeft(colee_left.scrollLeft()-=colee_left1.width())//scrollWidth 是对象的实际内容的宽，不包边线宽度
}
else{
var t=colee_left.scrollLeft()+1;
colee_left.scrollLeft(t);
//alert(t);
//alert(7)
}
}
var MyMar3=setInterval(Marquee3,speed);
colee_left.mouseover(function() {clearInterval(MyMar3)});
colee_left.mouseout(function() {MyMar3=setInterval(Marquee3,speed)});
}
});
</script>
HTML:
<UL class="tab_conbox" id=tab_conbox2_foot>
这里借用了织梦的标签，意思就是标签里面的LI会去展现类型为15和16两个滚动图片（多个LI里面的HTML内容完全一样）。
{dede:channelartlist typeid='15,16'}
<LI class="tab_con" style="float:left;1000px; overflow:hidden;">
<div id="tabimgfather" style="2500px;">
<div class="tabimg" style="float:left; 1000px;">
{dede:arclist type='image.'}
<div class="tabimg01">
<div><a href="[field:arcurl/]"><img src="[field:litpic/]" border="0" width="152" height="111" /></a></div>
<div class="tabtext"><a href="[field:arcurl /]">[field:title /]</a> </div>
</div>
{/dede:arclist}
</div>
<div class="tabimg2" style="float:left; 1000px;"></div>
</div>
</LI>
{/dede:channelartlist}
</UL>