gallery.js是独立的图片轮播javascript插件,仅仅128行代码,适合企业官网、海报宣传、精品专题等图片播放
详情请阅读：git.oschina.net/wuquanyao/gallery.js
/*=========================================================
 * gallery.js 
 * author:wuquanyao
 * nickname:挪威森林
 * email:wqynqa@163.com
 * date:2015-10
 * ver:1.0.0
 *=========================================================*/
var gallery = {};
(function(gallery){
    gallery.pc = function(config)
    {
        factory(config);
    }
    gallery.mobile = function(config)
    {
        //do something,follow up!!
    }
    var wrapper,root,len,dotwrapper,dottag,iwidth,awidth,height,dotwrapper,duration,index=0,offset=0,prev=0;
    //selector,pc or mobile,dot tag,duration
    function factory(config)
    {
        wrapper  = document.queryselector(config['selector']);
        //render image
        create_img(config['data'], wrapper);
        root        = wrapper.parentnode;
        len         = count( wrapper);
        dotwrapper  = wrapper.nextsibling;
        dottag      = config['dottag'] || 'span';
        iwidth      = root.offsetwidth;
        awidth      = iwidth*len;
        height      = root.offsetheight;
        dotwrapper  = wrapper.nextsibling;
        duration    = config['duration'];
        //render dot
        create_dot();
        //interval
        intervalmove();
        //event listener
        mouseaction();
    }
function create_img(imgs, wrapper)
    {
        var tag = '', str = '';
            for(i in imgs){
                tag = ;
                for(key in imgs[i]){
                    regexp = new regexp('(%'+key+'%)','g');
                    tag    = tag.replace(regexp,imgs[i][key]);
                }
                str+=tag;
            }
            wrapper.innerhtml = str;
    }
    function create_dot()
    {
        var span   = ,
            regexp = new regexp('(span)','g') ,
            span   = span.replace(regexp,dottag),
            dots   = '';
            for(i=0;i                dots+=span;
            }
            dotwrapper.innerhtml = dots;
    }
    function intervalmove(type)
    {
        if(type === 'alone'){
            offset = index*iwidth;
            move();
        }else{
            dotwrapper.childnodes[index].classname = 'active';
            window.interval = setinterval(function(){
                if((index+1)                     offset = (index+1)*iwidth;
                    prev   = index;
                    index++;
                }else{
                    prev   = index;
                    offset = 0;
                    index  = 0;
                }
                move();
            },duration);
        }
        function move(){
            dotwrapper.childnodes[prev].classname  = 'normal';
            dotwrapper.childnodes[index].classname = 'active';
            wrapper.style.transition  = all 200ms linear 0ms;
            wrapper.style.transform   = translate(+(-offset)+px,0px);
        }
    }
    function mouseaction()
    {
        function eventparse(obj,type,func){
            if(document.attachevent){
                var events = {click:'onclick',mouseover:'onmouseover',mouseout:'onmouseout'};
                obj.attachevent(events[type],func);
            }else{
                var events = {click:'click',mouseover:'mouseover',mouseout:'mouseout'};
                obj.addeventlistener(events[type],func,false);
            }
        }
function init(){
            eventparse(root,'mouseover',function(){
                window.clearinterval(window.interval);    
            });
            eventparse(root,'mouseout',function(){
                intervalmove();
            });
            for(i=0;i                dotwrapper.childnodes[i].index = i;
                eventparse(dotwrapper.childnodes[i],'click',function(e){
                    prev  = index;
                    index = e.target.index;
                    intervalmove('alone');
                });
            }
        }
        init();
    }
    function count()
    {
        return wrapper.childnodes.length;
    }
})(gallery);效果图
gallery.zip ( 9.18 kb 下载：55 次 )
ad：真正免费，域名+虚机+企业邮箱=0元