created tooltips with jquery not working

Question

i am have create a tooltip for somwe divs but the div donot work.can any help me to find out where the problem my be.but i donot know if the new p created takes a position depending on the main div .because i floated all my div to the the left. thanks

$('div#myiris').tooltip({
    track: true, 
    delay: 0, 
    showURL: false, 
    //showBody: "- ", 
    //fade: 250,
    bodyHandler: function(){ return $('<p></p>').html('hello there').css({border:'1px solid black',
    width:'70px', height:'20px',display:'block',color:'blue'});
     }
     });

Answer 1

I'm also a bit confused about what you're asking, but here are some things that may help.

If you're trying to apply this tooltip to a div with id="myiris", all you have to do is this:

$(#myiris").tooltip({
     //your code here
});

Also, for the bodyHandler line, it looks like too much. Maybe try something like this:

bodyHandler: function(){
    $("p").html("hello there").css(
        'border' : '1px solid black',
        'width' : '70px',
        'height' : '20px',
        'display' : 'block',
        'color' : 'blue');
)};

Keep in mind that this will affect all p tags unless you specify it with an id or use traversal jQuery selectors using $(this) as your point of reference (which would be useful if you're trying to apply tooltips to more elements than just #myiris). e.g., if the <p> tag is a child of your <div id="myiris">, then you could reference it as $("#myiris").children("p"), then continue with the ".html()" and so on. I assume the .tooltip function applies to the element that the user is hovering over, so this example would apply to the <p> tag that is a child of the element that the user is currently hovering over. Otherwise, if you're only applying the tooltip to the one element #myiris, then you may as well just specify the <p> tag with an id, then reference it in your bodyHandler as $("#yourid").

As for the position or offset of the tooltip, this is probably built into the jQuery plugin that you're using and should have intuitive behavior out of the box. I wouldn't think that floating your div to the right or the left should affect the placement of your tooltip... I would expect the tooltip to appear relative to where the div is placed regardless of its float property, or even relative to the cursor position.

Hope that helps a bit. Anyone else have any suggestions or corrections on my comments?

PS - If you want more specific help with this issue, you'll probably need to post more code. Include a link to the jquery plugin that you're using and maybe some of your html code as well.