I have it almost working correctly in IE6, but have run into a few problems and I think it has to do with the the 2 different .js files. I do not code javascript, but can usually troubleshoot the scripts I find. This one has me stumped.
Background:
I have 2 .js files. One for a smooth horizontal scroll with arrows (anchor links), instead of just "jumping" to the link or using the bottom scroller. (js/thw.js)
The other is for a .png hack so the images are transparent in IE6. (js/pngfix.js)
IE6 Issues:
If you view the site in IE6, you will see that the 2 arrows at the end of the navigation are not transparent, and the navigation is not working--it jumps to the section instead of smoothly scrolling to it.
The background in the "About Dave" section is also not transparent.
I think the problem you are having with the pngfix.js not working may be that it works on the document.images collection, which is correct, but the images you are trying to support you have set as background images for the 'a' tags via css. This means they are not included in the document.images collection, as they are merely background images. So the pngfix will never see them, unless you make them actually html img's. (I don't know if there is any way to support png's as background, don't think so..). As for the navigation not working, not sure about that yet. I'd suggest trying getting the pngfix to work first, see if nav works then, if not - come back here and we'll have another look at the nav script. (The posted links are sufficient, you won't need to post the nav script, unless you want to)
Actually, in the case that you still have any problems, or even if you do get it to work, try the following version of the pngfix script. I re-wrote it somewhat, as I noted a few things I did not like in it (mainly crappy syntax, but a few procedural things also), and figured that they may have possibly caused problems with the nav perhaps, as the pngfix may have had errors causing other scripts to go 'haywire' so to speak. So, try the following out also (replacement for the pngfix.js file):
Code:
/*
Correctly handle PNG transparency in Win IE 5.5 & 6.
http://homepage.ntlworld.com/bobosola. Updated 18-Jan-2006.
Use in <HEAD> with DEFER keyword wrapped in conditional comments:
<!--[if lt IE 7]>
<script defer type="text/javascript" src="pngfix.js"></script>
<![endif]-->
*/
var arVersion = navigator.appVersion.split("MSIE");
var version = parseFloat(arVersion[1]);
if (version >= 5.5 && document.body.filters) {
for (var i=0; i<document.images.length; i++) {
var img = document.images[i];
var imgName = img.src.toUpperCase();
if (/PNG$/.test(imgName)) {
var imgID = (img.id) ? 'id="' + img.id + '" ' : '';
var imgClass = (img.className) ? 'class="' + img.className + '" ' : '';
var imgTitle = (img.title) ? 'title="' + img.title + '" ' : '';
var imgStyle = 'display:inline-block;' + img.style.cssText;
if (img.align) {
imgStyle = 'float:' + img.align + ';' + imgStyle;
}
if (img.parentElement.href) {
imgStyle = 'cursor:hand;' + imgStyle;
}
var strNewHTML = '<span ' + imgID + imgClass + imgTitle;
strNewHTML += ' style="width:' + img.width + 'px; height:' + img.height + 'px;' + imgStyle;
strNewHTML += '; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'';
strNewHTML += img.src + '\', sizingMethod=\'scale\');"><\/span>';
img.outerHTML = strNewHTML;
i = i-1;
}
}
}
I need my .png fix for IE6 to work with my "smooth scroller"
Reply With Quote
Bookmarks