HTMLpointHTMLpoint HTMLpoint.com


 DHTML: Gráfica y efectos con las imágenes

  • Imagen animadaDemo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Fácilmente configurable (es suficiente sustituir la imagen "vespa.gif" con otra imagen, incluso de tamaño diferente). Esta demo es ante todo un ejemplo que nos ayudará a comprender las potencialidades del HTML dinámico.

  • Drag'n'drop 1
    Compatibilidad: Ms Internet Explorer, Netscape
    HTML dinámico permite arrastrar objetos en la página gracias a las potencialidades de su modelo de objetos.
    En esta demo una imagen puede arrastrarse a cualquier parte de la pantalla.


  • Drag'n'drop 2
    Compatibilidad: Ms Internet Explorer, Netscape
    Como en el ejemplo anterior, esta demo permite, gracias a las potencialidades del DOM de HTML dinámico, arrastrar objetos en la página.
    En esta demo pueden arrastrarse tres imágenes a cualquier parte de la pantalla de manera completamente autónoma una de otra


  • Movimiento horizontal
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen en movimiento de un punto hacia la derecha, con otro enlace que hace que vuelva a la posición inicial.

  • Movimiento diagonal hacia abajo
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen en movimiento de un punto hacia abajo, con otro enlace que la devuelve a la posición inicial.

  • Movimiento diagonal hacia arriba
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen de un punto en movimiento hacia arriba siguiendo una trayectoria diagonal, con otro enlace que la devuelve a la posición inicial

  • Movimiento controlado por el teclado
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen cuyo movimiento hacia la derecha se controla manteniendo pulsada la tecla "A" del teclado.

  • Movimiento controlado por enlace Demo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Enlace que mueve una imagen cuando lo mantenemos pulsado. El procedimiento se interrumpe cuando el ratón sale del área del enlace.

  • Puzzle e imágenes dinámicas
    Compatibilidad: Ms Internet Explorer, Netscape
    La demo examinada, que se cuenta entre las más interesantes de esta recopilación, destaca por un efecto técnico y gráfico absolutamente inédito para las páginas web y el código HTML.
    La colocación dinámica es el eje de esta demo, que, si bien es de difícil impostación, permite obtener efectos estéticos de gran interés.


  • Imágenes en secuenciaDemo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Esta demo muestra cómo crear animaciones partiendo de simples file de imagen. El funcionamiento es similar al de los gif animados: se establece una secuencia y se asigna un tiempo, expresado en milésimas de segundo.
    Los usos de este ejemplo DHTML pueden ser muy variados y dependerán en gran medida de las decisiones que adopten los elaboradores.


  • Movimiento "arriba y abajo"Demo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen en continuo movimiento de arriba hacia abajo como un yo-yo

  • Movimiento remolino
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen en movimiento circular que se va debilitando hasta pararse en el centro del remolino.

  • Estrellas en movimientoDemo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Imágenes de estrellas que se mueven y expanden desde y hacia un centro.

  • Movimiento circular
    Compatibilidad: Ms Internet Explorer, Netscape
    Imágenes en continuo movimiento circular

  • Movimiento orbital
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen con el movimiento típico de la órbita terrestre.

  • Movimiento con forma de "ocho"
    Compatibilidad: Ms Internet Explorer, Netscape
    Imagen con movimiento continuo que sigue una trayectoria con forma de "8"

  • Estrellas en movimiento circularDemo TOP
    Compatibilidad: Ms Internet Explorer, Netscape
    Pequeñas imágenes de estrellas que giran, en continuo movimiento, alrededor de un centro ideal.

  • Imágenes con movimiento continuo
    Compatibilidad: Ms Internet Explorer
    Sencilla demo que genera una imagen con movimiento de izquierda a derecha y viceversa que no se para nunca.

  • Imágenes en movimiento con bloqueo final
    Compatibilidad: Ms Internet Explorer
    Similar a la demo anterior con la diferencia de que se bloquea en un punto predeterminado del documento.

  • Imagen que se agranda cuando pasa el ratónDemo TOP
    Compatibilidad: Ms Internet Explorer
    Esta demo produce en una imagen normal un efecto por el cual, cuando pasa por ella el ratón, sus dimensiones se modifican. Cuando el ratón sale de la imagen, ésta vuelve a su tamaño original.



  Vuelve a principio de página