Isolated Bootstrap Tooltip Undefined function

Question

I'm using the Bootstrap tooltip.js script without the rest of Bootstrap (v3).

My tooltip is ready :

$(document).ready(function(){
    $('[data-toggle="tooltip"]').tooltip();   
});

Everything seems ok but when I'm hover my element, I have got a jQuery error :

TypeError: undefined is not a function (evaluating '$tip
                .one('bsTransitionEnd', complete)
                .emulateTransitionEnd(Tooltip.TRANSITION_DURATION)')

What is missing ?

Answer 1

Because we use 'isolated' tooltip.js, we have to import the 'emulateTransitionEnd' bootstrap functions :

$.fn.emulateTransitionEnd = function (duration) {
    var called = false, $el = this
    $(this).one($.support.transition.end, function () { called = true })
    var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
    setTimeout(callback, duration)
    return this
};