As with any new browser, you have to do some testing and tweaking to get stuff to work. MathSciNet required some twiddling to get IE7 working correctly. I had three main issues to work through.
- visibility: hidden; didn’t work correctly in my style-sheet. The folders on the front page are divs layered over each other. I was using visibility: hidden to hide them and visibility: visible to make them visible. I had to switch to using display: none; and display: block; That solved the problem.
- PNGs with 8-bit transparency are now handled correctly. I was using proprietary Microsoft CSS statements to make this work in IE6 and lower. In IE7 both methods were being used and so I had two logos overlapping each other. I had to make a minor tweak to hide the proprietary method from IE7.
a#logo {
position: absolute;
top: 15px;
left: 0;
padding: 0;
width: 377px;
height: 47px;
display: block;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src=’/mathscinet/images/logo.png’, sizingMethod=’scale’ );
}a#logo, [junk=junk] { /* this hack is invisible to IE6 and lower */ background-image: url(/mathscinet/images/logo.png);
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader( src=” ); /* this turns off the proprietary method */ } - The obj.offsetTop and obj.offsetLeft DOM properties work differently in IE7 than any other browser. I had to detect IE7 and then use obj.offsetParent.offsetLeft + obj.offsetLeft to get things to line up properly. I detected IE7 with:
var ie7=document.all && window.XMLHttpRequest && !window.opera;
if( ie7 ){
…
}
One Comment
Thanks man, you saved me a lot of hassle. :) I had to fix some JS code for IE7 and didn’t know why the elements weren’t positioned like in the other browsers. Your code did the trick.