Reputation: 496
Hello I have a tool tip I am making with jquery, that loads the alt value from an image into a floating div thats being positioned by jquery offset(). My code works in Chrome/Safari but not Firefox.
In Chrome the tooltip appears above an icon which sits right of the label for this item. (This is also done in a modal box, maybe this is the problem?
I am still somewhat new to this so please excuse my code.
$("img.more_info, div.option_item_wrap label").live('mouseover', function(e) {
optionIcon = $(this).closest('div').find('img.more_info');
optionInfoContent = optionIcon.attr('alt');
if(optionInfoContent != undefined) {
findImage = $(this).closest('div').find('span.option_item_image');
$("body").append('<div id="option_info"><p>' + optionInfoContent + '</p><div id="option_info_tail"></div></div>');
findImage.clone().prependTo('div#option_info p');
toolTipHeight = $('div#option_info').height();
findIconPost = optionIcon.offset();
topPos = findIconPost.top - (toolTipHeight + 20);
leftPos = findIconPost.left - 80;
$('div#option_info').css('top', topPos).css('left', leftPos).fadeIn();
};
}).live('mouseout', function() {
$('div#option_info').remove();
});
Upvotes: 1
Views: 1057
Reputation: 496
if($.browser.mozilla){
topPos = findIconPost.top - (toolTipHeight + 90);
}
This was the only solution I could come up with, I just adjusted the offset for firefox.
Upvotes: 0
Reputation: 2626
Using the .live
function is not recommended due to various reasons. Try using a more typical approach:
$(document).ready(function() {
$("img.more_info, div.option_item_wrap label").mouseover(function() {
// Your code
});
});
This may or may not solve your problem but if it does, then you were experiencing the same issue as this question.
Upvotes: 1