Make jQuery tipsy appear on hover and on click

Question

At the moment, I am trying to get Tipsy to work on hover and on click. But I don't know if this is possible… It would be very inconvenient to use an other tool.

The trigger: 'manual' does not respond at all. Is it possible or do I really have to use an other tool?

This is part of the code:

function initiateMouseEvents() { $('.channel-hover').each(function() {

    $('svg circle, svg path').tipsy({
        gravity: 's',
        trigger: 'manual',
        html: true,
        title: 'data-tipsy'
    });

    var dataChannel = $(this).attr('data-channel');

    $(this).bind('mouseover', function() {
        if ($(this).attr('data-channel').length) {
            effectVisualisation.highlightChannel(dataChannel);
            costVisualisation.highlightChannel(dataChannel);
        }
    }).bind('mouseout', function() {
        if ($(this).attr('data-channel').length) {
            effectVisualisation.normalizeChannel(dataChannel);
            costVisualisation.normalizeChannel(dataChannel);
        }
    });
});

}

Answer 1

From your code I'm not sure what you're really trying to do, or your code is incomplete.

Please check out below HTML:

<a id="example-1" href="#" original-title="Hello World">Hover over me</a>
<a id="test" href="#" onclick="$('#example-1')[0].setAttribute('original-title','you did it')">Update</a>

Javascript:

$(function() {
    $('#example-1').tipsy();
});

that's what you might be expecting.

Edit: Sorry I'd to include code to post JsFiddle link.

http://jsfiddle.net/c3DUx/

Edit 2:

Check below fiddle, I hope you want something similar.

http://jsfiddle.net/c3DUx/2/