вопрос
Кто разбирается в js, можете в этот скрипт добавить/изменить эффект на затухание.
p.s. меня интересует fade эффект.
p.s. меня интересует fade эффект.
(function($) {
$.fn.easyPaginate = function(options){
var defaults = {
step: 5,
delay: 30,
numeric: true,
nextprev: false,
auto:true,
loop:true,
pause:8000,
clickstop:false,
controls: 'pagination',
current: 'current',
randomstart: false
};
var options = $.extend(defaults, options);
var step = options.step;
var lower, upper;
var children = $(this).children();
var count = children.length;
var obj, next, prev;
var pages = Math.floor(count/step);
var page = (options.randomstart) ? Math.floor(Math.random()*pages)+1 : 1;
var timeout;
var clicked = false;
function show(){
clearTimeout(timeout);
lower = ((page-1) * step);
upper = lower+step;
$(children).each(function(i){
var child = $(this);
child.hide();
if(i>=lower && i<upper){ setTimeout(function(){ child.fadeIn('fast') }, ( i-( Math.floor(i/step) * step) )*options.delay ); }
if(options.nextprev){
if(upper >= count) { next.fadeOut('fast'); } else { next.fadeIn('fast'); };
if(lower >= 1) { prev.fadeIn('fast'); } else { prev.fadeOut('fast'); };
};
});
$('li','#'+ options.controls).removeClass(options.current);
$('li[data-index="'+page+'"]','#'+ options.controls).addClass(options.current);
if(options.auto){
if(options.clickstop && clicked){}else{ timeout = setTimeout(auto,options.pause); };
};
};
function auto(){
if(options.loop) if(upper >= count){ page=0; show(); }
if(upper < count){ page++; show(); }
};
this.each(function(){
obj = this;
if(count>step){
if((count/step) > pages) pages++;
var ol = $('<ol id="'+ options.controls +'"></ol>').insertAfter(obj);
if(options.nextprev){
prev = $('<li class="prev">Previous</li>')
.hide()
.appendTo(ol)
.click(function(){
clicked = true;
page--;
show();
});
};
if(options.numeric){
for(var i=1;i<=pages;i++){
$('<li data-index="'+ i +'">'+ i +'</li>')
.appendTo(ol)
.click(function(){
clicked = true;
page = $(this).attr('data-index');
show();
});
};
};
if(options.nextprev){
next = $('<li class="next">Next</li>')
.hide()
.appendTo(ol)
.click(function(){
clicked = true;
page++;
show();
});
};
show();
};
});
};
})(jQuery);