i'm struggling with a problem for days and couldn't find an answer.
I've a little mouseover thing which works fine in all browser, but not (suprise) in IE7, IE8 nor IE9.
The intention is that a div appears on mouseover on a menu point and disappears on leaving the menu or the div. I've isolated the problem to the following line i guess: if ($('#top-navigation').is(':hover') || $('#header').is(':hover') || $('#menu a').is(':hover')) { Because of the behavor in IE i am quite sure that's the line of trouble.
$(document).ready( function() {
$mypage = $("body").attr("class");
$("#"+$mypage).show();
$("#menu a:contains('"+$mypage+"')").parent().addClass("current");
$("#menu a").hover(function() {
$(".transparent").hide();
$("#menu li").removeClass("current");
$(this).parent().addClass("current");
$element = "#" + $(this).text();
$($element).show();
});
function hide_popup(){
if ($('#top-navigation').is(':hover') || $('#header').is(':hover') || $('#menu a').is(':hover')) {
return false;
}else{
$("#menu li").removeClass("current");
$(".transparent").hide();
$mypage = $("body").attr("class");
$("#"+$mypage).show();
$("#menu a:contains('"+$mypage+"')").parent().addClass("current");
}
};
$("body").mouseover(function() {
window.setTimeout( hide_popup, 2000 );
});
});
I am happy on any help! Cheers!