开发者

Jquery tools - live tooltip for Ajax

I have a working version of tooltip (jQuery Tools - http://flowplayer.org/tools/demos/tooltip/index.html) ,

jQuery(document).ready(function() { 
jQuery('.more_info').each(function(){
   jQuery(this).tooltip({ 
       effect: 'slide',
       offset: [10, 570],
       predelay: 100, 
       position: "bottom left"}).dynamic( { 
        bottom: { 
        direction: 'down', 
        bounce: true 
    } 
    }); 
});   

});

after ajax is loaded , tooltips not working any more because , script already was loaded , i tried solution from forum http://flowplayer.org/tools/forum/30/37281 , but is not working , or is not implemented correctly

here is code :

jQuery(document).ready(function() { 
jQuery('.more_info').each(function(){
   jQuery(this).not('.tt_ini开发者_运维百科t').tooltip({ 
       effect: 'slide',
       offset: [10, 570],
       predelay: 100, 
       position: "bottom left"}).dynamic( { 
        bottom: { 
        direction: 'down', 
        bounce: true 
        } 
    });
    jQuery(this).not('.tt_init').addClass('tt_init'); 
});   

});

and nothing ... I'm doing something wrong , Thank you for helping ;) , sorry for my bad English


Same solution as the following:

livequery not working with groups

Use the livequery plugin. If tooltip holds for all your pages, it should be refreshed every time. This is were livequery comes in.

Also check this link:

JQuery slimbox rebind after ajax callback


If the problem is dynamic content you could try using the live jQuery api.

jQuery('.more_info').live('mouseover', function(){
    // may need to check here if it already has a tooltip (depending on plugin)
    jQuery(this).tooltip({ 
       effect: 'slide',
       offset: [10, 570],
       predelay: 100, 
       position: "bottom left"}).dynamic( { 
           bottom: { 
           direction: 'down', 
           bounce: true 
       } 
  }); 
});

Another solution is to manually activate tooltips for ajax content. something like:

$('#result').load('ajax/test.html', function() {
  $(this).find('.more_info').tooltip({*/...*/});
});

Or you could do this for all ajax requests using the global responders.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜