Hi, I have a table in my site that shows a list of products I get from a DB,
each one has and image (thats loaded on a hidden div). I'd like to show on a
tooltip eveytime the user hovers over the img element I placed on the table,
heres the script to do that (I'm using the 'live' function because the user
can add new products so I dynamically create a new img element):
1. $('.preview_boton_mercancia').live('mouseover', function() {
2. var id = $(this).attr("id").split("_");
3. var id_mercancia = id[1];
4. $('#preview_'+id_mercancia).tooltip({
5. tip: '#img_'+id_mercancia,
6. effect: 'fade',
7. });
8. });
9.
10. $('.preview_boton_mercancia').live('mouseout', function() {
11. var id = $(this).attr("id").split("_");
12. var id_mercancia = id[1];
13. var tooltip =
$('#preview_'+id_mercancia).tooltip('#img_'+id_mercancia);
14. tooltip.hide();
15. });
This works "almost" as intended the problems are:
1) The tooltip doesn't work on the first hover but after the second time the
user hovers the img element.
2) It doesn't work at all on dynamically created elements.
You can see an example here: http://sm-dev.webege.com/ (login: admin /
pass:admin)
Go to Registro -> Mercancia and hover over the preview icon.
Is it something I'm doing wrong? Any help will be appreciated.
Thanks in advance!
PD: This is in FF and Safari, in IE and Opera it won't work at all..
--
View this message in context:
http://old.nabble.com/-Tooltip-Plugin--Problem-with-tooltip-and-live-event-tp27484030s27240p27484030.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.
