Comunidad de diseño web y desarrollo en internet online

DIV CON DESAPARICIÓN GRADUAL

Citar            
MensajeEscrito el 07 Mar 2012 10:03 pm
Hola a todos, tengo un div que funciona como ventana emergente y necesito que se desvanezca al cabo de x segundos, hasta ahí todo bien, lo que necesito ahora es que el desvanecido no sea brusco sino gradual, y no se como modificarlo, el codigo es el siguiente:

Código Javascript :

<script language="javascript" type="text/javascript"> 
var Retraso = 2000 ; // Tiempo expresado en milisegundos 5000 equivale a 5 segundos 
<!-- 
function Desa(){ 
    document.getElementById("contenedor").innerHTML=""; 
}; 
window.load=setTimeout('Desa()', Retraso); 
--> 
</script>


Mucahs gracias a quién me pueda colaborar...

Por alejilla

Claber

120 de clabLevel



Genero:Femenino  

Colombia

chrome
Citar            
MensajeEscrito el 08 Mar 2012 12:29 am
Ya que lo haces con Javascript, puede usar setInteval para disminuir progresivamente la opacidad con "opacity" y cuando la opacidad sea menor o igual a cero, desaparecer el div ya sea haciéndolo invisible, eliminando el html que esté dentro o simplemente removiéndolo del DOM.

Por The Fricky!

Presidente

6168 de clabLevel

3 tutoriales
8 articulos

Genero:Masculino   Bastard Operators From Hell Héroes

Piccola Venezia...

firefox
Citar            
MensajeEscrito el 08 Mar 2012 03:00 pm
Ahora la importante no es la forma en que desaparece sino que apesar de que no se ve queda activo dejandome bloqueado lo que esta por debajo, cómo puedo eliminarlo del todo a la vez que se transparenta?

Muchas gracias.

Por alejilla

Claber

120 de clabLevel



Genero:Femenino  

Colombia

chrome
Citar            
MensajeEscrito el 08 Mar 2012 03:19 pm
Que un elemento tenga opcidad cero solo significa que es totalmente transparente pero no por eso deba de estar ahí.

Al finalizar la animación debes hacer que ese elemento tenga display: none; para que realmente desaparezca de la interacción del usuario.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 09 Mar 2012 12:56 am
Por que no pruebas con fadeout / fadein de jQuery?

Por cranecx

21 de clabLevel



Genero:Masculino  

Desarrollador Web

chrome
Citar            
MensajeEscrito el 09 Mar 2012 06:07 pm
si para que se complican la vida si con jquery se puede hacer
http://www.actualidadjquery.es/2010/10/19/animacion-simple-utilizando-fadein-y-fadeout-de-jquery/
o con
http://jquery.phpbasic.com/divbox

Saludos cordialess

Por joshuavw

Claber

306 de clabLevel



Genero:Masculino  

Juego, aprendo y programo

firefox
Citar            
MensajeEscrito el 09 Mar 2012 06:15 pm
¿Para qué cargar una librería + un script para algo que puedes hacer fácilmente en menos de 10 líneas de código? No es complicarse la vida, se llama optimización

Por The Fricky!

Presidente

6168 de clabLevel

3 tutoriales
8 articulos

Genero:Masculino   Bastard Operators From Hell Héroes

Piccola Venezia...

firefox
Citar            
MensajeEscrito el 09 Mar 2012 08:33 pm
Coincido con The Frick!.

Es un desperdicio de recursos cargar toda una biblioteca para usar solo una función de ella.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 13 Mar 2012 12:44 am
@The Fricky! @DriverOp @joshuavw
Quizas solo tenia ese detalle en su proyecto, pero quizas tiene mas funcionalidades que esta desarrollando con JavaScript puro.

Que si bien es cierto tomar en cuenta la optimizacion del sitio web, tambien es cierto que jQuery puede simplifcar muchas tareas repetitivas y tediosas.

Hasta cierto punto todos los comentarios tienen validez, pero es mejor preguntar antes de hablar!
Quizas le ayudariamos mejor a @alejilla preguntandole que realmente esta haciendo y que esta utilizando para su proyecto de ahi podriamos responder mejor. Claro que si responder mejor es lo que se pretende.

Por Kenkyo

7 de clabLevel



Genero:Masculino  

Programador, Ciclista, Igenioso

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.