buenas tardes a todos
busco alguna colaboración con respecto a efectos de un slider que me encuentro creando tengo varios efectos de bloques corriendo adecuadamente pero
la cuestión es la siguiente quiero crear un efecto con jquery en la que los bloques se intercalen debidamente pero solo logro que el ultimo o primero realicen dicha función
||||||||||| salen de arriba cumpliendo su función
| sale de abajo
y lo que busco es
| | | | | | | salen de arriba
| | | | | | salen de abajo
aquí esta el código que estoy empleando
// determinar cantidad de bloques en que se dividira el ancho del contenedor y permitir el interactuar con el link
var blocksdouble = function(figure, settings, defaults) {
if($(defaults.heir).parent().is('a')) $(defaults.heir).parent().css('display','inline');
$('div').not('').width(figure.width()).show();
$('div').not('').parent().is('a') ?
$('div').not('').parent().height() :
$('div').not('').height();
for(var i = 0; i < 15; i++){
var Didth = Math.round(figure.width()/15);
for(var b = 0; b < 1; b++){
var Deight = Math.round(figure.height()/1);
if(i === 15-1){
figure.append($('<div id="i"><img src="'+ defaults.heir.attr('src') +'" style="max-width: none;position:relative;width:'+ figure.width() +'px; left:-'+ ((Didth + (i * Didth)) - Didth) +'px;"></div>').css({
left:(Didth*i)+'px',
width:(figure.width()-(Didth*i))+'px',
opacity:'0',
overflow:'hidden',
position:'absolute',
zIndex:'5',
height:(figure.height()-(Deight*b))+'px',
border: 'none',
top:(Deight*b)+'px',
})
);
}else{
figure.append($('<div id="i"><img src="'+ defaults.heir.attr('src') +'" style="max-width: none;position:relative;width:'+ figure.width() +'px; left:-'+ ((Didth + (i * Didth)) - Didth) +'px;"></div>').css({
left:(Didth*i)+'px',
width:Didth+'px',
opacity:'0',
overflow:'hidden',
position:'absolute',
zIndex:'5',
height:Deight+'px',
border: 'none',
bottom:(Deight*b)+'px',
})
);
}
}
}
$('div').height();
img.stop().animate({
height: $(defaults.heir).height()
});
};
y este seria la ejecución
else if(effect === 'weave' || effect === 'weaveTop' || effect === 'weaveBottom'){
blocksdouble(figure, settings, defaults);
delay = 150;
i = 0;
slices = $('div');
if(effect === 'weaveTop') { slices = $('div').reverse(); }
slices.each(function(){
var slice = $(this);
var origHeight = slice.height();
slice.css({height:'0' });
if(i === 15-1){setTimeout(function(){slice.animate({ height:origHeight, opacity:'1'},2000, '', function(){ figure.trigger(''); });},delay);
} else {setTimeout(function(){slice.animate({ height:origHeight, opacity:'1'},2000);},delay);
}
delay += 150;
i++;
});
}
