Ver Mensaje Individual
  #1 (permalink)  
Antiguo 11/12/2012, 09:56
isabelramirezmontoya
 
Fecha de Ingreso: noviembre-2010
Mensajes: 204
Antigüedad: 14 años, 3 meses
Puntos: 1
Efecto en capa

Chicos tengo una duda, me colaboran por favor

Tengo una capa que se abre al presionar un boton, funciona bien.

Quisiera saber si es posible tener un efecto sobre la capa de forma tal que se abra/cargue no de forma instantanea como lo hace en este momento, si no que se abra/cargue en forma mas elegante por ejemplo en forma de cortina de "arriba hacia abajo"

Código HTML:
Ver original
  1.  
  2.  
  3. <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\" />
  4.  
  5. <title>Prueba</title>
  6.  
  7. <script type="text/javascript">
  8.        
  9. function abrir_capa()
  10. {
  11.    var ventana = document.getElementById('capa');
  12.    ventana.style.display = 'block';
  13. }
  14.  
  15. function cerrar_capa()
  16. {
  17.     var ventana = document.getElementById('capa');
  18.     ventana.style.display = 'none';
  19. }
  20.  
  21.  
  22. </head>
  23.  
  24. <div><a id="boton" href="javascript:abrir_capa()">Abrir capa</a></div>
  25.  
  26. <div id="capa" style="position: fixed; width: 350px; height: 350px; top: 50; left: 250; font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; border: #333333 1px solid; background-color: #FFFFFF; color: #000000; display:none;">
  27.  <div style="font-weight: bold; text-align: left; color: #FFFFFF; padding: 5px; background-color:#006394">Capa</div>
  28.  
  29. <center>** abc **</center>
  30.  
  31.  <div style="padding: 4px; text-align: center; margin-top: 275px;"><input onclick="cerrar_capa" name="btnAceptar" size="20" type="button" value=" Cerrar " /></div>
  32. </div>
  33.  
  34. </body>
  35. </html>

Gracias

Última edición por isabelramirezmontoya; 11/12/2012 a las 10:03