jquery cluetip on dynamic elements

Question

I can't seem to get this to work properly.

I am writing several links to the DOM (looping through a json file and appending to the DOM), and then I need those elements to trigger tooltips on hover.

I'm not seeing a good example of this method anywhere - the cluetip site shows a brief example, of looking for the a and calling cluetip then. I'm thinking there must be a .live or .delegate way to do this:

$("body").delegate("a.toolTip", "mouseover", function (event) {

            $('a.toolTip').cluetip({
                showTitle: false,
                attribute: 'title',
                local: false
                });

            event.preventDefault();

        });

but this doesn't trigger the first mouseover and I get a "sorry, contents could not be loaded"

Any ideas?

thanks

Have you tried `.on()` with `mouseenter` and `mouseleave`? – ayyp Jul 10 '12 at 20:25 — ayyp, Jul 10 '12 at 20:25

Kevin B · Accepted Answer · 2012-07-10T20:50:25.037

You need to re-trigger the mouseover event.

$("body").delegate("a.toolTip", "mouseenter", function (event) {
    $('a.toolTip').cluetip({
        showTitle: false,
        attribute: 'title',
        local: false
    }).trigger("mouseenter");

    event.preventDefault();
});

Additional nitpick things:

~~event.preventDefault() should come first~~, and you should prevent the plugin from being applied multiple times.

$("body").delegate("a.toolTip:not(.hasTooltip)", "mouseenter", function (event) {

    $('a.toolTip').cluetip({
        showTitle: false,
        attribute: 'title',
        local: false
    }).addClass("hasTooltip").trigger("mouseenter");
    event.preventDefault();
});

Edit: mouseover should have been mouseenter, and the event.preventDefault really should be last so that if it does fail, the default tooltip will still work.

positioning is initially screwy, and contents are still not loading - although the title does exist in the link. — Jason, Jul 10 '12 at 20:39

jquery cluetip on dynamic elements

1 Answers1