jQuery lightweight tooltip script advice

Question

Estoy buscando un guion jQuery liviano para tooltips que sea liviano y se pueda usar fácilmente con mapas de imágenes ... Idealmente tomaría automáticamente el 'título' de cada etiqueta de área para funcionar como un información sobre herramientas. La razón por la cual este es un problema es que tengo cientos de áreas (es un mapa mundial) y una línea de código para cada información sobre herramientas pronto se sumará al tamaño del archivo.

q Sugerencia puede hacer esto ... pero es 38kb ... que es más que incluso jQuery. ¿Alguna recomendación?

Answer 1

No estoy seguro si es exactamente lo que estás buscando, pero echa un vistazo a Tipsy:
http://onehackoranother.com/projects/jquery/tipsy/

9 KB sin comprimir
4 KB minified

Answer 2

Utilizo el título imaginativo titulado "jQuery Tooltip": demo here. Funciona bien con mapas de imágenes, y es fácil de personalizar con CSS.

(Casualmente, probé qTip con mapas de imágenes y encontré un error raro cuando se combina con el complemento Map Hilight).

Answer 3

vTip podría ser un buen candidato (ver demo). Está un poco desactualizado, pero es muy simple y debería funcionar.

Simplemente marque su elemento DOM agregando class = "vtip" en él, p. Ej.

<a href="#" title="Tooltip content" class="vtip">Tooltip test</a> 

El archivo JS no comprimido tiene solo 4 KB.

Si desea manejar su información sobre herramientas de una manera más dinámica, considere creating your own simple tooltips.

Answer 4

Superconsejo

http://stevenbenner.github.io/jquery-powertip/

Superconsejo cuenta con un diseño muy flexible que es fácil de personalizar

• Soporta sobre herramientas estáticas, así como información sobre herramientas que siguen el ratón
• capacidad de permitir a los usuarios del ratón en la información sobre herramientas e interactuar con su contenido
• Mouse tooltips sigue son constrai Ned a la ventana del navegador
• Ligera JS ~ 10KB, CSS ~ 2 KB

---

Tipsy

http://onehackoranother.com/projects/jquery/tipsy/

Es usado por Twitter, Github, Slideshare y Bitbucket, entre otros.

• JS ligeros ~ 10KB, CSS 2 KB ~

Answer 5

Después de grandes ninguna investigación de respuestas a esta pregunta me dio satisfacción.

que necesitaba una solución que es ligera, no es abandonware como Tipsy (Última actualización Hace años, las solicitudes de extracción de fijación 63 errores ignorados por el autor) y que se puede usar información de herramienta tan típico como sugerencia para campos de formulario en vuelo estacionario, pero también para validación dinámica de campo después de enviar formulario.

Realmente bueno es como se mencionó anteriormente PowerTip, pero hay un gran problema con él: solo puede tener una información sobre herramientas visible a la vez. Para mí es la descalificación, he comprobado los recursos y esto es suposición básica de autor - sólo una información sobre herramientas a la vez, hay un solo objeto DOM para todas las sugerencias etc.

Tooltipster

Después de perder otra hora me encontré solución que es exactamente lo que necesitaba: Tooltipster. Es realmente fácil de implementar (muy similar a PowerTip) pero le permite preparar y mostrar muchos consejos sobre herramientas a la vez. Otra ventaja es el hecho de no usar imágenes en absoluto, solo es js (~ 12k) y css.

Espero que esto le ahorrará muchas horas de investigación a alguien.