Page 1 of 1
jQuery Tooltip
Posted: Fri Nov 18, 2011 4:14 pm
by Pazuzu156
I have a tooltip for an image on my page, and when they mouseover the image it fades in and fade out on mouseout.
My issue is when they mouseover the tooltip itself, it fades in and out constantly. How do i fix this?
Code: Select all
$(function() {
$("#imgtooltip").hide();
$("#imgtooltip").appendTo("#person");
$("#ppic").mouseover(function() {
$("#imgtooltip").fadeIn('fast');
});
$("#ppic").mouseout(function() {
$("#imgtooltip").fadeOut('fast');
});
});
Re: jQuery Tooltip
Posted: Mon Nov 21, 2011 5:40 am
by Esteban11
If you are seeing this in Firefox - then the 'zoom' trick isn't going to help...
Since you have Firefox available, I'd suggest using Firebug and poking around with the CSS attributes. Switch them on and off to see what makes a diference and alter then on the page. zIndex is the obvious one to look at - but I don't think the demo css sets that for DataTables...
Re: jQuery Tooltip
Posted: Mon Nov 21, 2011 10:13 pm
by Pazuzu156
Esteban11 wrote:If you are seeing this in Firefox - then the 'zoom' trick isn't going to help...
Since you have Firefox available, I'd suggest using Firebug and poking around with the CSS attributes. Switch them on and off to see what makes a diference and alter then on the page. zIndex is the obvious one to look at - but I don't think the demo css sets that for DataTables...
That's not my issue. It works properly, comes and goes as told to. It's just when i decide to mouseover the tooltip, it wants to fade out. Then the mouse touches the images again, then it repeats itself.
Re: jQuery Tooltip
Posted: Tue Nov 22, 2011 11:24 am
by pickle
I may be able to give a better answer if I see how it works, but from what I understand, something like the hoverIntent plugin might help. Additionally, you could put a delay on your fadeOut of sorts, so it will only start to fade out after 1000ms.
Re: jQuery Tooltip
Posted: Tue Nov 22, 2011 2:36 pm
by califdon
If you tell it to fade out imgtooltip when you mouseout of ppic, then that's what it's going to do, so it depends on where imgtooltip is compared to ppic. Do they overlap? When your cursor is over imgtooltip, is it beyond ppic? If imgtooltip is within the boundaries of ppic, then the browser probably considers that your cursor has "moused out" of ppic when it goes over imgtooltip, since I don't think the mouse cursor can ever be "in" more than one element at a time. Perhaps in the mouseout function you could test whether the cursor is over the imgtooltip and only execute the fadeOut if it is not.
Re: jQuery Tooltip
Posted: Tue Nov 22, 2011 10:51 pm
by Gopesh
Hi,demonstrate it using
http://jsfiddle.net/.then others can see the working example and work around for solutions.
Re: jQuery Tooltip
Posted: Tue Nov 29, 2011 8:22 pm
by Pazuzu156
Gopesh wrote:Hi,demonstrate it using
http://jsfiddle.net/.then others can see the working example and work around for solutions.
http://jsfiddle.net/Pazuzu156/XZhJF/
Re: jQuery Tooltip
Posted: Wed Nov 30, 2011 8:32 am
by Gopesh
Hi, check this link
http://jsfiddle.net/XZhJF/2/.Hope that it works
Re: jQuery Tooltip
Posted: Wed Nov 30, 2011 11:52 am
by Pazuzu156
Perfect. Thank you.