Hovers not working in IE

JavaScript
1

So i’m new to JS and I had made some simple fade in animation for my nav bar, everything worked great in Chrome, Safari, FF, Opera, but when I got to work today and got on IE7 the navigation wasn’t even clickable!

www.facetofacetutoring.com

Any suggestions?

2

anybody with IE 7> can you please see if the hovers work in the navigation, the only time I get to test IE is when I’m at work because I have a mac at home and I just cant upgrade my IE at work lol

3

Is there a “if” statement that I could use with Jquery that could check the opacity for the IE browser and other browsers and create the same fade affect.

4

thanks allan Ill give it a try

5

The problem is caused by the different ways IE and other browsers handle opacity. The following script may help. This one fades between two images; one over the other.
// -------------------
var isIE=false, useFade=false,currentTop, currentBotm ; //global
function initL()
{ // get image div object refs
currentTop=document.getElementById(“imgDiv_1”); // global ref to div
currentBotm=document.getElementById(“imgDiv_2”); // global ref to div
//
// check for user agent type. IE first
if(typeof currentTop.style.opacity==“undefined” && navigator.userAgent.indexOf(“MSIE”)!= -1) // check for IE
{ // IE opacity value reqd is 0-100
// set initial opacity for both divs
currentTop.style.filter = ‘alpha(opacity=100)’; // visible
currentBotm.style.filter = ‘alpha(opacity=20)’; // invisible
isIE=true; // flag IE as browser
useFade=true; // flag fade can be used
return true;
}
else if(typeof currentTop.style.opacity==“string” && navigator.userAgent.indexOf(“MSIE”)== -1) // check for not IE
{ // not IE opacity value reqd is 0.0-1.0
// set initial opacity for both divs
currentTop.style.opacity = 1; // visible
currentBotm.style.opacity = 0.2; // invisible
isIE=false; // flag IE is not browser
useFade=true; // flag fade can be used
return true;
}
else
{ // not recognised. don’t use opacity changes
isIE=false; // flag IE is not browser
useFade=false; // flag fade cannot be used
alert(“error”);
return false;
}
}
// ============== end of initL =======================