Ver Mensaje Individual
  #28 (permalink)  
Antiguo 20/06/2009, 13:22
Avatar de pato12
pato12
 
Fecha de Ingreso: septiembre-2007
Ubicación: Salta
Mensajes: 1.620
Antigüedad: 17 años, 3 meses
Puntos: 101
Respuesta: Ayuda con texto desplegable.

Hola,
Prueba con esto:
Código javascript:
Ver original
  1. function toggle(id,time){
  2.     var el=document.getElementById(id);
  3.     if(el.style.display=='none'){
  4.         setHeight(el,getHeight(el,true),true,time);
  5.     }else{
  6.         setHeight(el,0,true,time);
  7.     }
  8. }
  9. function setHeight(elm,fin,efected,time){
  10.     if(fin>1){
  11.         elm.style.display='block';
  12.     }
  13.     elm.style.overflow="hidden";
  14.     if(efected){
  15.         if(elm.interval)clearInterval(elm.interval);
  16.         var time=!time?50:(time<2?2:time);
  17.         var act=getHeight(elm,false);
  18.         var org=act;
  19.         elm.interval=setInterval(function(){
  20.             if((org<fin?act>=fin:act<=fin)){
  21.                 if(fin==0){
  22.                     elm.style.display='none';
  23.                 }
  24.                 clearInterval(elm.interval);
  25.             }
  26.             act=(act>fin?act-Math.ceil((act-fin)/time):act+Math.ceil((fin-act)/time));
  27.             elm.style.height=act+'px';
  28.         },1);
  29.     }else{
  30.         if(fin==0){
  31.             elm.style.display='none';
  32.         }
  33.         elm.style.height=fin+'px';
  34.     }
  35. }
  36. function getHeight(elm,full){
  37.     if(!full){
  38.         return elm.clientHeight==0?elm.offsetHeight:elm.clientHeight;
  39.     }else{
  40.         origdisp=elm.style.display;
  41.         origheight=elm.style.height;
  42.         origpos=elm.style.position;
  43.         origvis=elm.style.visibility;
  44.         elm.style.visibility="hidden";
  45.         elm.style.height="";
  46.         elm.style.display="block";
  47.         elm.style.position="absolute";
  48.         var total=elm.clientHeight==0?elm.offsetHeight:elm.clientHeight;
  49.         elm.style.display=origdisp;
  50.         elm.style.height=origheight;
  51.         elm.style.position=origpos;
  52.         elm.style.visibility=origvis;
  53.         elm.style.display="block";
  54.         return total;
  55.     }
  56. }
Y lo ejecutas haci:
Código javascript:
Ver original
  1. toggle('ID DEL ELEMENTO',TIEMPO);
Tambien si nesesitas puedes usar las dos funciones (setHeight,getHeight) mirando como las uso para el efecto.
Suerte
Salu2

PD: Anda en IE 5.5 al 8, Mozilla Firefox, Opera, Google Chorme y Safari (son todos los que conosco )
__________________
Half Music - www.halfmusic.com

Última edición por pato12; 20/06/2009 a las 13:32