Forum Moderators: open
I have a floating DHTML menu linked to my web pages and JavaScript image zoom code linked to images on the pages, but both scripts won't work together in IE6. The page is just white/blank. In FF they work together fine. I've been trying to work out the reason for the conflict but don't have the necessary knowledge about JavaScript. Could someone help me out, please?
Just after the opening body tag:
<body>
<!-- DO NOT MOVE! The following AllWebMenus code must always be placed right AFTER the BODY tag-->
<!-- ******** BEGIN ALLWEBMENUS CODE FOR allwebmenu ******** -->
<span id='xawmMenuPathImg-allwebmenu' style='position:absolute;top:-50px'><img name='awmMenuPathImg-allwebmenu' id='awmMenuPathImg-allwebmenu' src='./awmmenupath.gif' alt=''></span><script type='text/javascript'>var MenuLinkedBy='AllWebMenus [4]', awmBN='622'; awmAltUrl='';</script><script charset='UTF-8' src='./allwebmenu.js' language='JavaScript1.2' type='text/javascript'></script><script type='text/javascript'>awmBuildMenu();</script>
<!-- ******** END ALLWEBMENUS CODE FOR allwebmenu ******** -->
Images have an ONMOUSEOVER event linked to it:
<div class="maintext">
<p align="center"><span class="style9">Peka Peka House by Architecture Workshop</span></p>
<div class="headertitle">
<table width="25%" border="0" align="right" cellpadding="1" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
<caption align="bottom" class="style3">
Peka Peka House
</caption>
<tr>
<td><div align="center"><img src="pekapeka/700/CRW_8948_Robert_Such.jpg" name="myImage" width="117" height="175" hspace="10" vspace="10" border="0"
ONMOUSEOVER="javascript:myImage.height=700;myImage.width=468"
ONMOUSEOUT="javascript:myImage.width=117;myImage.height=175"></div></td></tr>
</tr>
</table>
Thanks,
NoBob.
- JS
No, I just get a blank page when I open the page with both scripts from Dreamweaver, or open it directly with IE.
NoBob
- JS
I uploaded the variations to see how things look. Am even more confused since even the page with only DHTML doesn't work in IE any more (I linked the DHTML to a blank HTML page and it works fine!).
[robertsuch.com...] (DHTML but not image zoom) works in FF but not IE
[robertsuch.com...] (DHTML and image zoom) works in FF, but not IE
[robertsuch.com...] (no DHTML and no image zoom) works in both FF and IE
[robertsuch.com...] (image zoom only) works in FF and IE
[robertsuch.com...] (only DHTML linked to blank HTML page) works in both FF and IE
NoBob.
NoBob.
It works on the blank page in IE because there is no other HTML to render after it, but on your first example, there is a bunch of tables/content after it, so IE bombs on the script that tries to create the menu.
Solution:
I would normally say just move the menu to the bottom, but it appears the authors comments suggest other wise (<!-- DO NOT MOVE!... -->).
In this case, I would suggest leaving the span and image tags right after the <body> tag, but then moving all the <script> tags to the end of your document, right before the </body>.
If that still doesn't work, then you would need to dynamicly write the scripts into the DOM when the onload event fires.
- JS
Thanks I moved the DHTML JS to just before the </body> tag but no luck
[robertsuch.com...]
I wouldn't know how to start writing the script into the DOM (I had to look up what DOM stands for!). Any chance you could give me some pointers?
NoBob
window.onload = function() {
var b = document.getElementsByTagName("body")[0];
var firstElement = b.firstChild;
var s = b.createElement("span");
s.id = "xawmMenuPathImg-allwebmenu";
s.style.position = "absolute";
s.style.top = "-50px";
b.insertBefore(s,firstElement);
var m = s.createElement("img");
m.name = "awmMenuPathImg-allwebmenu";
m.id = "awmMenuPathImg-allwebmenu";
m.src = "./awmmenupath.gif";
m.alt = "";
s.appendChild(m);
var js = document.createElement("script");
js.type = "text/javascript";
js.src = "./allwebmenu.js";
document.appendChild(js);
awmBuildMenu();
</script>
- JS
[robertsuch.com...] working in FF and IE
Nobob
