user525146
user525146

Reputation: 3998

Attach tooltip to just the div with class

I want to attach the tooltip just the div with the class hello, if I hover over the span, the tooltip is getting attached to the span element and its just stuck over there and not getting destroyed. What am I missing here

<div class="hello">
    Hello
    <span class="world ui-icon ui-icon-save"></span>
</div>

$('.hello').hover(function(e){
    $(this).tooltip({
        content: function(callback) {
            callback("hello");   
        },
        items: '*'
    }).tooltip("open");
}, function() {
    $(this).tooltip('destroy');
});

fiddle

Upvotes: 0

Views: 688

Answers (1)

sjm
sjm

Reputation: 5468

Firstly thank you for providing a fiddle

Secondly, the Tooltip initialization code apply's mouseover/mouseleave events to the element so you don't need to embed it in a "hover" method

And if you wish to only show the Tooltip once, then destroy it so it will not show again, use the Close method i.e.

$('.hello').tooltip({
    content: function(callback) {
        callback("hello");   
    },
    items: '*',
    close: function( event, ui ) {
         $( this ).tooltip( "destroy" );
    }
})

See http://jsfiddle.net/sjmcpherso/n8kjdzgc/ for working example

Upvotes: 1

Related Questions