萬盛學電腦網

 萬盛學電腦網 >> 腳本專題 >> javascript >> jquery實現圖片翻頁效果

jquery實現圖片翻頁效果

 jquery實現圖片翻頁效果,大家可以使用下面的方法

   代碼如下: $(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;   }    
copyright © 萬盛學電腦網 all rights reserved