I am using the Milonic DHTML Menu V5.788 and have constructed a beautiful image based (Client required it) menu backed up with a list based no script menu for the folks with Javascript disabled (and spiders). Everything looks great on the Mac (FF 2.0.0.11, Safari 3.0.4, Netscape 7.2), as well as on my XP box in Firefox (2.0.0.11).
Unfortunately when it comes to IE7 on the XP box the submenu offsets that I set for the submenus are not functioning (Surprise Surprise Surprise!). Why this is for the life of me I can not figure out, and as IE7 is perhaps the most used browser out there, IT NEEDS TO LOOK RIGHT! (As it does in Firefox, Mozilla, Safari, Netscape)
Can any one help me out of my misery?
I should mention that the main menu has been placed inside a div, all according to the instructions on the Milonic site for placing menus relative to tables. My assumption here is that I can place the menu into a div the same as for a table.
Many Thanks in Advance
You can check the menu at http://www.sozostudio.com/dev/
Here is the Page Code;
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>SozoStudio | Welcome</title>
<!--[if gt IE 6]>
<style type="text/css" media="all"> @import"c/ie7andlater.css";</style>
<![endif]-->
<!--[if lte IE 6]>
<style type="text/css" media="all"> @import"c/ie6andearlier.css";</style>
<![endif]-->
<link href="css/sozoMain.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
</script>
</head>
<body>
<script type="text/javascript" src="milonic_src.js"></script>
<script type="text/javascript" src="mmenudom.js"></script>
<script type="text/javascript" src="menu_data.js"></script>
<div class="hide" id="skipMenu"><a href="#content" title="Skip to Main Content." accesskey="2">Skip
to Main Content</a>.</div>
<div id="wrapper">
<div id="header">
<h1>SozoStudio</h1>
<a href="index.html"><img src="images/SozoLogo.jpg" alt="SozoStudio" id="SozoLogo" /></a>
<div id="Nav" onfocus="MM_preloadImages('images/nav/humanDimen-o.gif','images/nav/humanDimen.gif','images/nav/innovation-o.gif','images/nav/innovation.gif','images/nav/knowHow-o.gif','images/nav/knowHow.gif','images/nav/contact-o.gif','images/nav/contact.gif','images/nav/designers-o.gif','images/nav/designers.gif','images/nav/home-o.gif','images/nav/home.gif','images/nav/innovAndKnowHow-o.gif','images/nav/innovAndKnowHow.gif','images/nav/kitchenArch-o.gif','images/nav/kitchenArch.gif','images/nav/qualIngredients-o.gif','images/nav/qualIngredients.gif','images/nav/gregDeMeza-o.gif','images/nav/gregDeMeza.gif')">
<script>
with(milonic=new menuname("Main Menu")){
style=AllImagesStyle;
alwaysvisible=1;
orientation="horizontal";
position="relative";
aI("image=images/nav/home.gif;overimage=images/nav/home-o.gif;url=index.html;");
aI("image=images/nav/designers.gif;overimage=images/nav/designers-o.gif;showmenu=designers;");
aI("image=images/nav/innovAndKnowHow.gif;overimage=images/nav/innovAndKnowHow-o.gif;showmenu=IAKH;");
aI("image=images/nav/kitchenArch.gif;overimage=images/nav/kitchenArch-o.gif;showmenu=kitchArch;");
aI("image=images/nav/contact.gif;overimage=images/nav/contact-o.gif;url=contact.html;");
}
drawMenus();
</script>
<noscript>
<ul id="noScriptNav">
<li class="toplevel"><a href="index.html">Home</a></li>
<li class="toplevel">Designers
<ul>
<li><a href="pages/gregDeMeza.html">Greg De Meza</a></li>
</ul>
</li>
<li class="toplevel">Innovation + Know How
<ul>
<li><a href="pages/innovation.html">Innovation</a></li>
<li><a href="pages/knowHow.html">Know How</a></li>
<li><a href="pages/ingredients.html">Quality Ingredients</a></li>
<li><a href="pages/dimension.html">The Human Dimension</a></li>
</ul>
</li>
<li class="toplevel">Kitchen Architecture
<ul>
<li><a href="pages/spKitchen.html">Space Kitchen</a></li>
<li><a href="pages/collab.html">Collaboration</a></li>
<li><a href="pages/recipes.html">Recipes</a></li>
</ul>
</li>
<li class="toplevel"><a href="pages/contact.html">Contact</a></li>
</ul>
</noscript>
</div>
<!-- End of div id= Nav -->
</div>
<!-- End of div id= header -->
<!--<div id="main_nav">
<ul class="level1">
<li id="home"><a href="08-index.html">Home</a></li>
<li id="gals" class="submenu"><a href="08-pages/gals.html" title="Here you will find portfolio galleries of my best work.">Galleries</a>
<ul class="level2" id="galSub">
<li id="commIllust"><a href="08-pages/commIllust.html" title="Here you will find samples of my Commercial Illustration work.">Commercial
Illustration</a></li>
<li id="archIllust"><a href="08-pages/archIllust.html" title="Here you will find samples of my Architectural Illustration work.">Architectural
Illustration</a></li>
<li id="jazzArt"><a href="08-pages/jazzArt.html" title="Here you will find samples of my Jazz artwork.">Jazz
Art</a></li>
<li id="popArt"><a href="08-pages/popArt.html"title="Here you will find samples of my Pop artwork.">Pop
Art</a></li>
<li id="abstractArt"><a href="08-pages/abstArt.html" title="Here you will find samples of my Abstract artwork">Abstract
Art</a></li>
</ul>
</li>
<li id="repros" class="submenu"><a href="08-pages/repros.html" title="Here you will find galleries of my work that you can purchase to hang on your walls.">Reproductions</a>
<ul class="level2" id="reproSub">
<li id="gicleePrints"><a href="08-pages/gPrints.html" title="Here you will find fine art Giclee prints of my work for sale."> Giclee
Prints</a></li>
<li id="smallPrints"><a href="08-pages/sPrints.html" title="Here you will find small prints of my work for sale.">Small
Prints</a></li>
</ul>
</li>
<li id="blog"><a href="08-pages/blog/blog.html" title="Check out my Blog and learn about my World...">Blog</a></li>
<li id="tests"><a href="08-pages/tests.html" title="See what some of my clients have had to say about my work">Testimonials</a></li>
<li id="about"><a href="08-pages/about.html" title="Her you can find out more about me, Rich Sigberman">About/Contact</a></li>
<li id="links"><a href="08-pages/links.html" title="Here are some links that I think you'll find useful or interesting.">Links</a></li>
</ul>
</div>-->
<!-- End of div id= main nav -->
<div id="contentWrap"> <img src="images/hpMainImg.jpg" alt="" width="598" height="267" id="mainImg" title="" /> <img src="images/hpMainQuote.jpg" width="598" height="52" alt="" title="" id="mainQuote" />
<div id="content"> <img src="images/hpSideQuote.jpg" alt="Home Page Side Quote" longdesc="pages/Page Quotes/hpQuote.html" id="sideQuote" />
<div id="rightCol">
<p>These are the factors we considered at SOZO Studio when we decided to
take a fresh look at the modern kitchen. We started by clearing our minds
of as many traditional design conventions and constraints as possible.
We met with a broad range of people, <br />
from professional chefs to microwave-dinner enthusiasts,
and we researched current market offerings. We culled everything into a <br />
list of criteria for the New Kitchen.</p>
<p> </p>
<p>Then we gave our list to an architect known for his <span class="emphasis">modern
design</span> aesthetic, <span class="emphasis">experience</span> with
materials and construction expertise.</p>
</div>
<br class="clear" />
</div>
<!-- End of div id= content-->
</div>
<!-- End of div id= contentWrap -->
<div id="footer">
<p> </p>
</div>
<!-- End of div id=footer-->
</div>
<!--/*End of div id= Wrapper*/-->
</body>
</html>
Code: Select all
fixMozillaZIndex=true; //Fixes Z-Index problem with Mozilla browsers but causes odd scrolling problem, toggle to see if it helps
_menuCloseDelay=500;
_menuOpenDelay=50;
_subOffsetTop=15;
_subOffsetLeft=0;
with(AllImagesStyle=new mm_style()){
styleid=1;
fontstyle="normal";
fontweight="normal";
padding=3;
separatorcolor="#333333";
separatorsize=1;
}
with(menuStyle=new mm_style()){
fontfamily="Verdana, Tahoma, Arial";
fontsize="75%";
fontstyle="normal";
headerbgcolor="#ffffff";
headercolor="#000000";
outfilter="randomdissolve(duration=0.3)";
overfilter="Fade(duration=0.2);Alpha(opacity=90);";
padding=5;
}
with(milonic=new menuname("designers")){
orientation="horizontal";
style=menuStyle;
aI("image=images/nav/gregDeMeza.gif;overimage=images/nav/gregDeMeza-o.gif;url=pages/gregDeMeza.html;");
}
with(milonic=new menuname("IAKH")){
orientation="horizontal";
left="offset=-120";
style=menuStyle;
aI("image=images/nav/innovation.gif;overimage=images/nav/innovation-o.gif;url=pages/innovation.html;");
aI("image=images/nav/knowHow.gif;overimage=images/nav/knowHow-o.gif;url=pages/knowHow.html;");
aI("image=images/nav/qualIngredients.gif;overimage=images/nav/qualIngredients-o.gif;url=pages/ingredients.html;");
aI("image=images/nav/humanDimen.gif;overimage=images/nav/humanDimen-o.gif;url=pages/dimension.html;");
}
with(milonic=new menuname("kitchArch")){
orientation="horizontal";
left="offset=-108";
style=menuStyle;
aI("image=images/nav/spaceKitchen.gif;overimage=images/nav/spaceKitchen-o.gif;url=pages/spKitchen.html;");
aI("image=images/nav/collaboration.gif;overimage=images/nav/collaboration-o.gif;url=pages/collab.html;");
aI("image=images/nav/recipes.gif;overimage=images/nav/recipes-o.gif;url=pages/recipes.html;");
}
drawMenus();