Utilizamos cookies propias y de terceros para mejorar nuestros servicios y mostrarle publicidad relacionada con sus preferencias mediante el análisis de sus hábitos de navegación. Si continúa navegando, consideramos que acepta su uso.
Las cookies de este sitio web se usan para personalizar el contenido y los anuncios, ofrecer funciones de redes sociales y analizar el tráfico. Además, compartimos información sobre el uso que haga del sitio web con nuestros partners de redes sociales, publicidad y análisis web, quienes pueden combinarla con otra información que les haya proporcionado o que hayan recopilado a partir del uso que haya hecho de sus servicios. Puede cambiar la configuración u obtener más información aquí

Aceptar

Presentación de Imagenes 3 (Slide Show)

Google

Imágenes

Presentación de Imagenes 3 (Slide Show)

La clásica presentación de imágenes que se van sucediendo en forma automática (slideshow)

La diferencia entre esta presentación y las anteriores está sólo en la forma de realizar el cambio a la siguiente imagen. En este script la imagen actual desaparece bajando su opacidad a la vez que la siguiente imagen aparece la siguiente subiendo su opacidad mezclandose ambas durante el proceso de transición.

Internet Explorer ofrece una forma muy sencilla de hacer casi lo mismo mediante filters.blendTrans.apply() y filters.blendTrans.play() pero tiene el inconveniente de que sólo funciona en IExplorer además de que no permite centrar las imágenes en la transición y si la presentación utiliza imágenes de distintas dimensiones queda "raro".

Configuración

var segundos = 5 //cada cuantos segundos cambia la imagen
var dire = "fotos" //directorio o ruta donde están las imágenes

Crear el listado (array) de imágenes

imagenes[0]="foto1.jpg"

En el ejemplo se usan 5 imágenes (de la 0 a la 4). Para agregar más simplemente se añade otra línea con un índice correlativo

imagenes[5]="imagen.jpg"

Finalmente donde queramos que se muestren las imágenes (en body):

<script>escribe()</script><script>escribe()</script>

NOTA: El script está preparado para una imagen centrada. Importante que esté de un contenedor centrado.

NOTA: script actualizado el 28/12/2003 - 10/2011

Click en la imagen para iniciar la presentación.

ver el código fuente del ejemplo

Mostrar código

Parte código javascript [Seleccionar] 


Buscador de animales en adopción
Creative Commons License
Javascript códigos by tunait is licensed under a Creative Commons Reconocimiento-Compartir bajo la misma licencia 2.5 España License.
Permissions beyond the scope of this license may be available at http://tunait.com/javascript/index.php?s=condiciones.

Todos los códigos incluídos los de la página han sido paridos y tecleados por tunait.com. Política de cookies subir