Ver Mensaje Individual
  #2 (permalink)  
Antiguo 12/01/2008, 17:04
Avatar de Panino5001
Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 9 meses
Puntos: 834
Re: efectos y manipulacion de capaz

Fijate si esto te sirve como orientación:
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml">
<
head>
<
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<
title>test</title>
<
script>
function $(
id){
    return 
document.getElementById(id);
}
function 
easingOut(obj,prop,inicio,fin,tiempo,rozamiento,unidad){
var 
i=setInterval(function(){
obj.style[prop]=fin-(fin-parseInt(obj.style[prop]))*rozamiento+unidad;
if(
parseInt(obj.style[prop])/fin*100 >= 99){
obj.style[prop]=fin+unidad;
clearInterval(i);
}
},
tiempo);
}

function 
easingIn(obj,prop,inicio,fin,tiempo,rozamiento,unidad){
var 
i=setInterval(function(){
obj.style[prop]=Math.abs(fin-(fin-parseInt(obj.style[prop]))*rozamiento)+unidad;
if(
parseInt(obj.style[prop])/fin == 1){
obj.style[prop]=fin+unidad;
clearInterval(i);
}
},
tiempo);
}

window.onload=function(){
$(
'abrir').onclick=function(){
easingOut($('pp'),'width',1,500,10,.6,'px');
easingOut($('pp'),'height',1,500,10,.6,'px');
}

$(
'cerrar').onclick=function(){
easingIn($('pp'),'width',500,1,10,.6,'px');
easingIn($('pp'),'height',500,1,10,.6,'px');
}
}
</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
  <input id="abrir" type="button" name="abrir" value="abrir" />
  <input id="cerrar" type="button" name="cerrar" value="cerrar" />
  <div id="pp" style="background:#FFCC33;position:relative;width:1px;height:1px;overflow:hidden;">hola<br />
hola<br />
hola</div>
</form>
</body>
</html> 

Última edición por Panino5001; 12/01/2008 a las 21:03