jquery实现图片翻页效果

87407607 2013-12-23

代码如下:

$(function($){

    $.fn.changeList = function(options){


        var defaults = {


                    tag : 'li', // tab name


                    subName : '.utilTabSub', // sub class name


                    eventType : 'click', // event type


                    num : 4,


                    showType : 'show' // show effect type


                },


                opts = $.extend({}, defaults, options),


                that = $(this),


                subUl = that.find(opts.subName),


                subItems = subUl.find('li'),


                size = subItems.length,


                liW = subItems.outerWidth(true),


                ulW = liW * size,


                page = size + 1,


                n = opts.num,


                randNum = 0,


                m = 0;


 


        if(size > n){


            that.find(opts.tag)[opts.eventType](function() {


                randNum = mathRand(n, size);


                subItems.hide();


                $.each(randNum, function (i, el) {


                    subItems.eq(el).fadeIn(800);


                });


            });


        }


    };


}(jQuery));


 


/**


 * create Random number


 * @param bit: number


 * @param max: max number


 * @return {Array}


 */


function mathRand(bit, max){


    var num = 0,


            arr = [],


            ret = [];


    for(var i=0; i<bit; i++){


        num = Math.floor(Math.random() * max);


        if($.inArray(num, ret) == -1){


            ret.push(num);


        } else {


            i--;


            continue;


        }


    }


    return ret;


}

相关推荐

zhuxianfeng / 0评论 2020-02-09