jquerycallbacktipsy

Callbacks on jQuery Tipsy hide / show


I'm trying to set a callback function after tipsy opens / closes.

function addText()
{
    $('#text').html('Tipsy is now open !');
}

$('.tipsy').tipsy(addText);   

I want addText() to run after tipsy opens, but it doesn't.

Is there an easy way to do that without modifying tipsy core code ?

Here is my jsfiddle : http://jsfiddle.net/Tqcgr/1/


Solution

  • It was easy to add onShow and onHide callbacks. Check this out: http://jsfiddle.net/Tqcgr/2/

    BUT you need to modify show and hide methods.

    //show
    var callback = this.options.onShow,
        element = this.$element[0],
        runCallback = function() {
            if(callback){
                callback.call(element);   
            }
        };
    
    //invoke
    if (this.options.fade) {
        $tip.stop().css({opacity: 0, display: 'block', visibility: 'visible'}).animate({opacity: this.options.opacity}, runCallback);
    } else {
        $tip.css({visibility: 'visible', opacity: this.options.opacity});
        runCallback();
    }
    
    //hide
    var callback = this.options.onHide,
        element = this.$element[0],
        runCallback = function() {
            if(callback){
                callback.call(element);
            }                        
        };
        //invoke
    if (this.options.fade) {
        this.tip().stop().fadeOut(function() { $(this).remove(); runCallback()});
    } else {
        this.tip().remove();
        runCallback();
    }