por - Recomendaciones para la información sobre herramientas de jQuery
cuál es el nombre del archivo para código angularjs por default (15)
Estoy buscando complementos de información sobre herramientas para jQuery que permitan el siguiente tipo de comportamiento.
<a href="somewhere.html">
<span>
<img src="someimage.jpg" style="display: none;" />
Here is the tooltip content.
</span>
Here is the link to somewhere.
</a>
El comportamiento que estoy esperando es pasar el cursor sobre "Aquí está el enlace a algún lado" y tener una ventana emergente emergente que muestra el contenido del tramo que contiene "someimage.jpg" y "Aquí está el contenido de la información sobre herramientas".
Preferiría que la información sobre herramientas rastree junto con el movimiento del mouse sobre el enlace y que la apariencia de la información sobre herramientas (color de fondo, opacidad, color de borde, etc.) sea configurable.
Los dos consejos más populares que he encontrado, "clueTip" y "Tooltip" de Jörn Zaefferer, no parecen encajar en la lista, a menos que me falta algo.
En última instancia, los enlaces y las imágenes se generarán dinámicamente.
jQuery UI ahora tiene un módulo integrado de información sobre herramientas: http://jqueryui.com/tooltip/
Funciona bien y es fácilmente personalizable.
Esto debería permitirle poner lo que quiera en el cuadro de información sobre herramientas.
http://code.google.com/p/next-msg/
Además tiene temas
He pensado en usar esto: http://www.codylindley.com/blogstuff/js/jtip/
y esto: http://onehackoranother.com/projects/jquery/tipsy/
los otros recomendados pueden adaptarse mejor a sus necesidades
Soy un gran fanático de BeautyTips
¿Tiene que ser jquery? Puedes hacerlo con solo CSS si quieres.
a.info
{
position: relative;
z-index: 24;
}
a.info:hover
{
z-index: 25;
}
a.info span
{
display: none;
}
a.info:hover span
{
display: block;
position: absolute;
top: 2em;
left: 2em;
width: 15em;
padding: 6px;
border: 1px solid black;
background-color: #eeeeee;
color: #000;
}
Entonces puedes usarlo tal como lo tienes.
<a href="somewhere.html" class="info">
<span>
<img src="images/someImage.jpg" />
Here is the tooltip content.
</span>
Here is the link to somewhere.
</a>
EDITAR
Al leer mi dosis diaria de blogs, me llamó la atención este artículo . Crean un plugin jquery que hace lo que quieres, muestra una imagen con opciones de estilo y movimiento del mouse. Mira el resultado aquí.
http://james.padolsey.com/demos/imgPreview/full/
Debería poder seguir el tutorial y escribir el plugin o descargar el plugin de ejemplo.
OHHHHHHHH ¡El mejor de todos!
http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/
Demostraciones: (busque el ejemplo "Enlace a Yahoo" para satisfacer todas sus necesidades)
http://jquery.bassistance.de/tooltip/demo/
EDITAR: veo que mencionaste a Jorn (no sabía su nombre) pero busca el ejemplo de "yahoo" que debería hacer lo que quieras.
Te digo la verdad, probé un par de ellos, pero me quedo con uno que realmente me gusta:
¡hay muchas cosas que puedes cambiar y se ven fantásticas en cualquier lugar! :)
texto alternativo http://www.balexandre.com/temp/_jquerySimpleTip.png
Actualizado
Como dijo pbz, esto ya no está disponible para infrangiments de derechos de autor, pero lo mismo se puede encontrar en el desarrollador ''original'' en
También puede probar una herramienta llamada Likno Web Tooltips Builder: http://www.likno.com/jquery-tooltips/index.php
Simplemente el mejor http://flowplayer.org/tools/tooltip/index.html
Aquí hay una información sobre herramientas de jQuery que puede hacer casi cualquier cosa, se ve muy bien también:
Recomiendo ClueTip: http://plugins.learningjquery.com/cluetip/ Es fácil de usar, admite saltos de línea en las sugerencias de herramientas (con un separador libremente configurable) y parece funcionar bien dentro de las celdas de la tabla (que no era el caso de http: //bassistance.de/jquery-plugins/jquery-plugin-tooltip/ ).
Este es uno excelente que uso, tiene opciones de seguimiento posicional y de mouse, también viene con un montón de temas listos para usar. http://www.websanova.com/plugins/websanova/tooltip
También he creado un plugin jQuery para información sobre herramientas , es realmente pequeño, 5 KB minificado, muy fácil de configurar y usar, y con muchas opciones de configuración; posicionará las puntas dentro de la ventana gráfica independientemente del desplazamiento vertical / horizontal o del tamaño de la ventana; El ancho y el color de fondo se pueden cambiar en la inicialización. No usó imágenes en absoluto: utiliza CSS para todo lo que se desea y se degrada graciosamente para los navegadores más antiguos. Funciona incluso en IE6 :) Y, por defecto, se ve así:
NewTip ->
New Tooltip JQuery plugin with support in browsers from IE7+, Firefox, Chrome
Muy atractivo y fácil de personalizar tanto para eventos de devolución de llamadas como para cualquier tipo de elemento.
darle una oportunidad :
Registro de complementos de JQuery: http://plugins.jquery.com/newtip/
Página de inicio de Github: https://github.com/chandra7mca/newtip
q Sugerencia : no hay dudas al respecto
Ver aquí , también