How do I correctly show a JQuery Tool tooltip only on mouse click?

Whenever a user clicks a menu item I want to show a tooltip:
// Initialize tooltips for each menu_item
$(“.menu_item_tooltip_link a.tooltip”).tooltip({
opacity: 1.0,
position: “bottom center”,
effect: “slide”,
direction: “bottom”,
offset: [0, 0],
relative: true,
events: { def: “click,mouseout”, tooltip: “mouseenter” }
});

The tooltip should never be hidden, unless the user clicks the tooltip’s close button:
$(“.menu_item_tooltip_close”).click(function () {
$(this).parents(“.menu_item_tooltip:first”).hide();
});
Everything is working fine, but when the tooltip is closed and the cursor stays in the element that triggered the tooltip it will not be shown until I leave the bounds of the item and click it again.

Any idea how to fix this?

Hi there,

Could you give us a clue as to what HTML goes with that code.
Have a look at this to find out how to make an example we can reproduce your issue with.

no I just need an example so that I can use this feature if you can give us that would be good I am not good in javascript so above code is copied . if anyone have done anything in past then help me

Oh, ok.
Then why don’t you use aToolTip.
There’s a demo on the project’s homepage that demonstrates how to have it display on click.