欢迎使用CSDN-markdown编辑器

引用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"
        });
    })

html页面

<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>