lunes, 26 de julio de 2010

Mostrar imagen con botón de cerrar y cierre automático

Es el mismo código que la parte 1, lo que esta ves se le va a agregar un tiempo para que se cierre solo.

Ver parte 1:

Ir a Diseño, Edición de HTML y justo arriba de </head>

Poner el siguiente código:
<script type='text/javascript'>
function cerrarelemento(){
div = document.getElementById(&quot;cerrarelemento&quot;);

div.style.display=&quot;none&quot;;
}
setTimeout(cerrarelemento, 90000);
</script>

Cambiar milisegundos 90000 (90 segundos)

1 segundo es igual a 1000 milisegundos.

El contenido a mostrar lo colocaremos abajo de <body>

<div id='cerrarelemento' style='border: 0 !important; background: transparent; left:15px;top:10px;position:fixed;width: 190px;z-index:9999'>
<a href='javascript:cerrarelemento();'>
<img src='URL DE LA IMAGEN CERRAR' style='float: right;border: 0' title='Cerrar'/>
<img src='URL DE LA IMAGEN' style='border: 0'/>
</a>
</div>

Guardamos los cambios.

Códigos CSS para personalizar:

left:15px: distancia desde la izquierda.
top:10px: distancia desde arriba.
position:fixed: se muestra el contenido del div siempre fijo con la posición establecida por left y top.
width: 190px: distancia desde la izquierda para mostrar la imagen de cerrar.
float: right: muestra la imagen de cerrar del lado derecho.

Por otros detalles sobre el código ver: Parte 1.

Botones de cerrar:

Si ya están utilizando el código de la parte 1, solo agregar esta línea arriba de </script>:
setTimeout(cerrarelemento, 90000);

No hay comentarios:

Publicar un comentario