[Jquery-Es] moo3dcircle para Jquery
viliomo
viliomo en gmail.com
Lun Dic 10 13:09:25 PST 2007
Holens,
He quedado admirado de la extensión para mootools de
http://www.outcut.de/MooFlow/Moo3DCircle.html y he intentado hacer un
plugin para Jquery ($('#nav3d').circle3d();).... Como es el primer
plugin que hago agradeceria si alguien me da alguna indicación de como
mejorar el código.
Código:
/***************************************************************************
/*
Esta es una adaptación paraa Jquery de la espectacular extensión para
Mootools de Moo3DCircle http://www.outcut.de/MooFlow/Moo3DCircle.html
Si alguien puede indicarme como ponerme en contacto con el autor de
Moo3DCircle, lo agradecería.
Modificación desarrollada por viliomo en gmail.com
GNU General Public License
*/
(function($) {
var ver = '0.9';
var arrayElementos=Array();
var id_timer;
contenedorWidth=100;
contenedorHeight=100;
container= 'nav3d';
iL = 0; //numero de imagenes
var tarX;
var tarY;
RX = 200;
RY = 200;
RZ = 50;
CX=400;
CY=200;
CZ = 70;
$.fn.circle3d= function(){
contenedorWidth=parseInt(this.css('width'));
contenedorHeight=parseInt(this.css('height'));
container=this.attr('id');
return this.each(function(){
//inicializar
CX = contenedorWidth*0.5;
CY = contenedorHeight*0.5;
//tarX = 0.001;
//tarY = 0.001;
tarX = 0.08; //movimiento X
tarY = 0; //movimiento Y
iL=$('#'+container+' li').size();
$('#'+container+' li').each(function(i){
this.id='nav3dit_'+i;
//arrayElementos[i]= {x:(2*Math.PI)*(i/iL),n:0};
arrayElementos[i]= {x:((2*Math.PI)*(i/iL))+26.25,n:0};
//arrayElementos[i].x=26.25;
arrayElementos[i].n=4.80;
});
$('#'+container).mousemove( function(el){
tarX = (el.screenX-CX-22)/2000;
tarY = (el.screenY-CY-22)/2000;
});
proceso();
});
};
function proceso(){
var s, c, j, m, newL, newT, scale;
for (i=0; i<arrayElementos.length; i++)
{
arrayElementos[i].x+= tarX;
s = Math.sin(arrayElementos[i].x);
c = Math.cos(arrayElementos[i].x);
arrayElementos[i].n += tarY;
j = Math.sin(arrayElementos[i].n);
m = Math.cos(arrayElementos[i].n);
scale = j*s*RZ+CZ;
newL = c*RX+CX-scale*0.5;
newT = m*s*RY+CY-scale*0.5;
$("#nav3dit_"+i).css({left: newL, height:scale,width:scale,
top: newT, zIndex: Math.round((j*s+1)*10), opacity:(j*s+1)});
}
id_timer=setTimeout(function(){proceso();},80);
};
})(jQuery);
/*****************************************************
Más información sobre la lista de distribución Jquery-Es