scrollimg.js

(function(win, doc, $) {
var scrollImg = {

fxcurr:function(){
if(!_this.def){
this.lfclick.find("b").addClass("curr");
}else{
this.lfclick.find("b").removeClass("curr");
}
if(_this.def==-(_this.clonum-1)){
this.rfclick.find("b").addClass("curr");
}else{
this.rfclick.find("b").removeClass("curr");
}
_this.scrollele.stop().animate({left:_this.width*_this.slen*_this.def},_this.speed,_this.easing);
},
lbind:function(){
this.lfclick.click(function(){
_this.def=_this.def++>=0?0:_this.def;
_this.fxcurr();

})
},
rbind:function(){
this.rfclick.click(function(){
_this.def=_this.def--<=-(_this.clonum-1)?-(_this.clonum-1):_this.def;
_this.fxcurr();
})
},

init: function(obj) {

_this=this;

this.wrap = $(obj.wrap);

this.speed = obj.speed || 1000;

this.lfclick=$(obj.leftclick);

this.rfclick=$(obj.rightclick);

this.scrollele=$(obj.scrollele);

this.curr = obj.curr || "curr";

this.len=this.scrollele.children().length;

this.slen=obj.slen||4;

this.clonum=Math.ceil(this.len/this.slen);

this.def=0;

this.width = this.scrollele.children().eq(0).outerWidth(true);

this.easing = obj.easing || null;

this.lfclick.find("b").addClass("curr");

if(this.clonum<2)
this.rfclick.find("b").addClass("curr");

this.lbind();
this.rbind();

}
};
win.scrollImg = scrollImg;
})(window, document, jQuery);

$(function(){
scrollImg.init({
wrap:".scrollwrap",
leftclick:".coll-left",
rightclick:".coll-right",
scrollele:".scrollwrap ul"
});
})

<div class="collection-list clearfix">
<span class="coll-left"><b class="mico m-left"></b></span>
<div class="scrollwrap">
<ul>
<li>
<a href="#"><img src="images/pro.jpg" /></a>
<p>￥151</p>
</li>
<li>
<a href="#"><img src="images/pro.jpg" /></a>
<p>￥152</p>
</li>
<li>
<a href="#"><img src="images/pro.jpg" /></a>
<p>￥152</p>
</li>
<li>
<a href="#"><img src="images/pro.jpg" /></a>
<p>￥152</p>
</li>
<li>
<a href="#"><img src="images/pro.jpg" /></a>
<p>￥152</p>
</li>
</ul>
</div>
<span class="coll-right textR"><b class="mico m-right"></b></span>
</div>