Personalizar la información sobre herramientas <img title>

Question

Me preguntaba si es posible personalizar la información sobre herramientas que obtenemos después de configurar el atributo title en una etiqueta img. Ahora obtengo un rectángulo estándar con fondo azul con texto y lo que me gustaría obtener es mi propia imagen (digamos algo que se parece a una nube) con texto en ella. ¿Es posible con css o js?

Answer 1

Necesita javascript para eso. intente this here o here O puede enrollar el suyo. Pero básicamente no hay forma de hacerlo directamente en html (no sé acerca de htm5/css3).

Answer 2

¡Crea el tuyo! Simplemente puede crear un div oculto en su HTML, luego, cuando alguien pase sobre la imagen, muestre su div en su lugar.

Answer 3

Si desea crear una información sobre herramientas personalizada, le recomiendo this. Le muestra, en detalle, cómo crear su propia información sobre herramientas en js, que son basadas en CSS y se pueden reutilizar fácilmente.

Además, si está utilizando un marco, las cosas se vuelven aún más fáciles. Por ejemplo, hay numerosos jQuery tooltip plugins. Estos le permiten hacer que su información sobre herramientas aparezca en el mouseover de cualquier elemento.

Answer 4

Recomendaré Tooltipster. Realmente fácil de usar, se puede usar en cualquier elemento que admita el atributo title y tiene muchas características y apariencia geniales.