Programatik

December 26, 2007

Sencillo sistema de tips en javascript

Filed under: JavaScript — Rafa @ 2:11 pm

Un cliente nos ha pedido un sistema que permita incluir un globo de información que se muestre al pasar sobre un enlace concreto.

Para lograr este efecto hemos escrito este sencillo código que hemos bautizado como TipSystem, ya que puede resultar útil para haer un sistema de tips o consejos basados en globos de información emergentes.

Se puede ver una demostración de su funcionamiento en el Lab:

http://www.rafachacon.com/lab/TipSystem/

En el código fuente podemos ver cómo los enlaces que necesitamos que reaccionen al pasar el ratón por encima tienen un atributo id de la forma tslink-NombreDelTip. También tenemos una sere de capas ocultas con id de la forma tip-NombreDelTip.

En el evento onload en Body se llama a la función javascript TipSystem() que inicia el proceso de captura de tips y aplicación de acciones a los eventos onmouseover de los enlaces marcados como sensibles para los tips.

Enlaces

  • http://www.rafachacon.com/lab/TipSystem/
  • Powered by WordPress