[Tooltip Plugin] Problem with tooltip and live event

Discussion:

vengiss

2010-02-06 22:35:37 UTC

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.

Renatho

2010-02-07 18:00:38 UTC

Permalink

Hi Vengiss,

$('#preview_'+id_mercancia).tooltip({
tip: '#img_'+id_mercancia,
effect: 'fade',
});

The error is the last comma.

Correct:
$('#preview_'+id_mercancia).tooltip({
tip: '#img_'+id_mercancia,
effect: 'fade',
});

This error doesn't affect IE and Safari because they are well done! =)

Post by vengiss
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
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. });
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-...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

vengiss

2010-02-09 16:21:41 UTC

Permalink

Thanks for the help It worked :)

Post by Renatho
Hi Vengiss,
$('#preview_'+id_mercancia).tooltip({
tip: '#img_'+id_mercancia,
effect: 'fade',
});
The error is the last comma.
$('#preview_'+id_mercancia).tooltip({
tip: '#img_'+id_mercancia,
effect: 'fade',
});
This error doesn't affect IE and Safari because they are well done! =)

Post by vengiss
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
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. });
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-...
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

--
View this message in context: http://old.nabble.com/-Tooltip-Plugin--Problem-with-tooltip-and-live-event-tp27484030s27240p27517831.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.

Renatho

2010-02-07 18:02:39 UTC

Permalink

the error is the last comma in literal object:

the correct is

6. effect: 'fade'
7. });

Continue reading on narkive:

Search results for '[Tooltip Plugin] Problem with tooltip and live event' (Questions and Answers)

replies

Mom addicted to World of Warcraft. Can anyone help?

started 2007-03-07 11:00:39 UTC

mental health