How to Get Rid of White Stripe At Top of Firefox Browser

I have the current version of Firefox installed. Recently, perhaps with the most recent install, I'm not exactly sure, a white stripe appeared at the top of the browser, right under the search and URL boxes at the top of where websites would normally show, a white stripe about a 1/2 inch thick has appeared. Not on every single site, google.com works fine, but for example, it blocks out the home, connect, discover and me tabs on Twitter. Or if you go to mozilla.com, the tabs at the top of the mozilla site briefly show, then are blocked by the white bar. You can't click on any of them, even if you have your mouse pointed at the right spot. You can refresh the screen and they'll briefly show again, but not long enough for you to click on anything.
I've run a number of search engine queries trying to find out how to get rid of this problem, but I'm only finding resolutions for webmasters, not for end users who have to deal with this problem on the other end of the browser.
Anyone know how to get rid of this nuisance? I'm about ready to uninstall Firefox because its useless on many sites with buttons and tabs on top.

I shut down all but one of the extensions, and that seems to have resolved the problem. Thank you!
Now to figure out which extensions I need, and which I don't, because I don't have a clue. I don't remember installing most of these, I only recall one or two (nothing looks spammy like funmoods, but still don't remember when or why these were added...)

Similar Messages

  • Can anyone explain to how to get rid off restore session on the mozilla firefox it keeps coming up every time i click on mozilla firefox it comes up restore session why is this it is driving me nuts

    can anyone explain to me how to get rid off restore session on the mozilla firefox it keeps coming up every time i click on mozilla firefox it comes up restore session why is this i want to get rid of it it is driving me nuts

    What do you have checked in Firefox Preferences>General?
    Ciao.

  • How to get rid of white space in EPS embedded in Word for letterhead template?

    Does anyone know how to get rid of the white band in the bottom of this letterhead?
    I embedded the EPS image (done via Illustrator) as a watermark in the header section of MS-Word.
    It looks fine in the Word version, but as soon as I try to print the document - either via Word or via a PDF - that white
    band on either side of the footer and underneath it keeps showing up. I can't get rid of it. I tried this on a PC and a Mac
    and those white bands won't go away.
    If anyone could let me know how to resolve this problem, I would be eternally grateful!
    Thank you.
    NZB

    If you want this to bleed, then you will have to print on oversize paper and trim or find a printer that will print borderless.

  • How to get rid of white icons on ipod touch 4th generation

    How do you get rid of white icons on the ipod touch 4th generation.  I tried resetting it already.
    Thanks,

    First, try a system reset.  It cures many ills and it's quick, easy and harmless...
    Hold down the on/off switch and the Home button simultaneously until the screen blacks out or you see the Apple logo.  Ignore the "Slide to power off" text if it appears.  You will not lose any apps, data, music, movies, settings, etc.
    If the Reset doesn't work, try a Restore.  Note that it's nowhere near as quick as a Reset.  Connect via cable to the computer that you use for sync.  From iTunes, select the iPad/iPod and then select the Summary tab.  Follow directions for Restore and be sure to say "yes" to the backup.  You will be warned that all data (apps, music, movies, etc.) will be erased but, as the Restore finishes, you will be asked if you wish the contents of the backup to be copied to the iPad/iPod.  Again, say "yes."
    Finally, if the Restore doesn't work, let the battery drain completely.  Then recharge for at least an hour and Restore again.

  • How to get rid of white space above footer in Muse

    I have a website that has several random pages where different sizes of white space will appear above the footer even though I did not put them there. How can I get rid of this empty white space?
    This is the page in Preview Mode:
    This is the page is Design Mode:
    This is the Master page in Design Mode:
    This is the Site Properties:

    Hi
    As I see the white space you refer to is as shown below, am I correct?
    Could you please get to this page in muse project and "select all items on a page" and check if there's any rectangle or div placed at the bottom ? If yes ! try removing the same and re-publish the site and check if that helps.
    Looking forward to your reply.
    PS : Please uncheck the sticky footer option in Site properties and check if it works.

  • How ndo get rid of tuneupmymac malware that loaded with firefox???

    I downloaded firefox onto my new mac mini and got the malware tuneupmymac and reset search (with a cardboard box icon ).
    I trusted Mozilla, didn't expect malware to come with it. How do I get rid of them? Putting them in the trash doesn't work.
    Thank you,
    newtom

    hello newtom, i don't know where you've downloaded it from, but original mozilla builds form mozilla.org will never come with such crap or bundled software.
    in order to address the issue you might want to [[Reset Firefox – easily fix most problems|reset firefox]] and for further steps see the following articles:
    *[[Remove a toolbar that has taken over your Firefox search or home page]]
    *[[Troubleshoot Firefox issues caused by malware]]

  • How to get rid of Quicktime "image" on top right of converted file

    I just converted a WMV file to both MOV and MP4 formats.  There is a Quicktime graphic on the top right now that looks like a circular button with the play icon in it.  I have a fully licensed version of Quicktime Pro v.7.  How can I get rid of that image (which comes across kind of like a watermark)?

    If you're converting WMV, you're probably using Flip4Mac as part of the QuickTime conversion process. The graphic is likely a Flip4Mac watermark. See: https://discussions.apple.com/thread/6418932.

  • How to get rid of blue bar at top when tethering?

    I would like to get rid of the blue bar at the top og my Iphone 4 when it is tethering its internet connection. What is interesting is my girlfriends iphone does not show this blue bar when tethering. Instead it shows a small icon in the top left next to the signal indicator. Could this be a carrier tweak. We both use AIS in Bangkok Thailand but her phone was originally bought from True mobile and mine was bought in China at an Apple store. Of course it is not a fake Iphone for any of you skeptics. I checked the serial with Apple in canada and it is real. I even had it in for free warranty repair one time in Bangkok.  Any help would be appreciated. I don't like this blue bar and want mine to appear like hers. It cuts the screen shorter and limits my use of the phone while tethering.

    use following add on
    https://addons.mozilla.org/en-US/firefox/addon/app-button-remove/?src=api
    it will removes the orange button of left hand side ,see the attached image what will this add on do

  • How To Get Rid Of White Space Around Footer

    Hi,
    I am really new at this (still trying to get a handle on HTML, CSS, etc.) and I need help fixing the footer in a template that I've created in Dreamweaver (CS5).
    Right now, my main background image extends the full width of the page with no problem. However, my footer won't do the same thing. Instead, there are white bars on either side of it and when I test the page in a browser, I keep finding that no matter how small I make the browser window, the footer still won't extend to the full width of the page - I just keep getting the white bars on either side (the footer does this in Dreamweaver, Internet Explorer, Chrome, Firefox, etc.).
    I created the footer using CSS, made its width 100%, and made sure that both the margins and the padding are 0. Here's what the CSS looks like for it:
    #footer {
              font-family: Arial, Helvetica, sans-serif;
              font-size: 11px;
              color: #464646;
              background-image: url(../Images/Other/Footer.jpg);
              background-repeat: repeat-x;
              text-align: center;
              width: 100%;
              margin-right: 0px;
              margin-bottom: 0px;
              margin-left: 0px;
              padding-right: 0px;
              padding-bottom: 0px;
              padding-left: 0px;
    And here's what my HTML coding looks like for the entire template:
    <!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=utf-8" />
    <!-- TemplateBeginEditable name="doctitle" -->
    <title>Template</title>
    <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <style type="text/css">
    body, td, th {
              font-family: Arial, Helvetica, sans-serif;
              color: #000;
    body {
              background-color: #FFF;
              background-image: url(../Images/Other/Main%20Body%20of%20Website.jpg);
              background-repeat: repeat-x;
    </style>
    <link href="../CSS/Allegeon Style Sheet.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    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];}}
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    <style type="text/css">
    a:link {
              text-decoration: none;
    a:visited {
              text-decoration: none;
    a:hover {
              text-decoration: underline;
    a:active {
              text-decoration: none;
    </style>
    </head>
    <body onload="MM_preloadImages('../Images/Navigation/Rollover/Services Rollover.jpg','../Images/Navigation/Rollover/Hands On Rollover.jpg','../Images/Navigation/Rollover/Onsite Rollover.jpg','../Images/Navigation/Rollover/Contact Rollover.jpg','../Images/Navigation/Rollover/Home Page Rollover.jpg','../Images/Navigation/Rollover/Learning Rollover.jpg')">
    <table width="681" border="0" align="center" cellpadding="0" cellspacing="0" summary="Table applied for page structure.">
      <tr>
        <td width="113"><div align="center"><a href="../Site Pages/index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('index','','../Images/Navigation/Rollover/Home Page Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Home Page Normal.jpg" alt="index" name="index" width="101" height="64" border="0" id="index" /></a></div></td>
        <td width="113"><div align="center"><a href="../Site Pages/Services.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Services','','../Images/Navigation/Rollover/Services Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Services Normal.jpg" alt="Services Link" name="Services" width="101" height="64" border="0" id="Services" /></a></div></td>
        <td width="113"><div align="center"><a href="../Site Pages/Hands On.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('HandsOn','','../Images/Navigation/Rollover/Hands On Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Hands On Normal.jpg" alt="Hands On Link" name="HandsOn" width="101" height="64" border="0" id="HandsOn" /></a></div></td>
        <td width="113"><div align="center"><a href="../Site Pages/Learning.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Learning','','../Images/Navigation/Rollover/Learning Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Learning Normal.jpg" alt="Learning" name="Learning" width="101" height="64" border="0" id="Learning" /></a></div></td>
        <td width="113"><div align="center"><a href="../Site Pages/Onsite.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Onsite','','../Images/Navigation/Rollover/Onsite Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Onsite Normal.jpg" alt="Onsite Link" name="Onsite" width="101" height="64" border="0" id="Onsite" /></a></div></td>
        <td width="116"><div align="center"><a href="../Site Pages/Contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Contact','','../Images/Navigation/Rollover/Contact Rollover.jpg',1)"><img src="../Images/Navigation/Normal/Contact Normal.jpg" alt="Contact Link" name="Contact" width="101" height="64" border="0" id="Contact" /></a></div></td>
      </tr>
    </table>
    <!-- TemplateBeginEditable name="LogoRegion" -->
    <table width="681" border="0" align="center" cellpadding="0" cellspacing="0" summary="Table applied for page structure.">
      <tr>
        <td width="280"><img src="../Images/Header Logos/Home Page Logo.jpg" width="280" height="214" alt="Allegeon Logo" /></td>
        <td width="401"><img src="../Images/Header Images/Baltimore Web Landscape.jpg" width="401" height="214" alt="Baltimore" /></td>
      </tr>
    </table>
    <!-- TemplateEndEditable --><br />
    <!-- TemplateBeginEditable name="BodyRegion" -->
    <table width="681" border="0" align="center" cellpadding="0" cellspacing="0" summary="Table applied for page structure.">
      <tr>
        <td> </td>
      </tr>
    </table>
    <!-- TemplateEndEditable -->
    <p id="footer"><br />
      <a href="../Site Pages/index.html" title="Home Link">HOME</a>  <span class="divider">l</span>  <a href="../Site Pages/Services.html" title="Services Link">SERVICES</a>  <span class="divider">l</span>  <a href="../Site Pages/Hands On.html" title="Hands On Link">HANDS ON</a>  <span class="divider">l</span>  <a href="../Site Pages/Learning.html" title="Learning Link">LEARNING</a>  <span class="divider">l</span>  <a href="../Site Pages/Onsite.html" title="Onsite Link">ONSITE</a>  <span class="divider">l</span>  <a href="../Site Pages/Contact.html" title="Contact Link">CONTACT</a><br />
      Copyright © Allegeon. Designed by Allegeon. Developed by <a href="http://www.KatherineGahs.com/" title="Designer Link" target="_blank">Katherine Gahs</a>. </p>
    </body>
    </html>
    Any help you can give me would be really appreciated!!! Thank you!

    body {
    margin: 0;
    padding: 0;
    If this is placed in the header html on a master or individual pages in Muse itself the problems appears to fix for me so one does not have to edit the HTML every time.

  • How can I get rid of white bar at top of desktop? MacBook Pro 10.5.8

    Hello,
    There is a 4" blank (or white) bar at the top RIGHT of my desktop, to the left of the Spotlight magnifier icon. The bar blanks out all of these drop-downs:  Open Time Machine Preferences, Detect Displays/Display Preferences, Open Bluetooth Preferences, Volume Bar, Open Network Preferences, inport Source, Battey Charge display/Energy Saver Preferences,  Date & Time set pref.
    Drives me nuts, to use a technical term! I can't see the time in the bar, can't adjust volume, can't check to see how many others are online in my condo complex. I like to try to go on when the highway isn't jammed up.
    Can anyone tell me how to remove that annoying blank white bar. I call it white because it covers the color on my desktop. That's why I don't think it's like a blank cell.
    Would appreciate any help and give BIG plaudits to anyone who can HELP!
    Thanks for reading this.

    Hi Clinton,
    I appreciate your suggestion and think I'll take your second suggestion. Been chiding myself for waiting so long to go with my begging bowl to the great Genius bar. Don't know if I'm ready to spring for the latest version, since everything else I need seems okay. You know how it is, it seems so simple: "If I could just get the key word the answer would pop up."
    It's really nice to know there is someone there reading these questions! Last time I asked a question I must have clicked on something incorrectly: my Inbox was flooded with replies, none of which even slightly addressed my problem, as you have.
    Thanks again and happy Sunday!
    Cat's PJ's

  • Extremely slow boot.  How to get rid of white screen in Windows only boot.

    Hey guys I have a Windows 7 only MacBookPro 17". 2.8ghz core 2 duo, 4 gig of ram, 7200 rpm 500gb hd(passes s.m.a.r.t. btw)
    It boots extremely slow. I turn the computer on and it stays at the white screen for around 20 seconds. Then it moves to Windows 7 and continues to boot from there. I have a video:
    http://www.dailymotion.com/video/xc5taaslow-windows-7-boot-on-macbook-protech
    In a windows only setting how would I get it to just boot Windows without going threw the white screen? It also gets hung when logging in on a black screen.
    There was a post on Ubuntu forums about Ubuntu only boots about doing something to get it to only boot the MBR. I didn't really understand if this would work with Windows 7 though. Thanks for any help.

    I shut down all but one of the extensions, and that seems to have resolved the problem. Thank you!
    Now to figure out which extensions I need, and which I don't, because I don't have a clue. I don't remember installing most of these, I only recall one or two (nothing looks spammy like funmoods, but still don't remember when or why these were added...)

  • How to get rid of white screen

    My daughters Ipod touch now has a white screen on it after we took it off of charge. How do we get the screen to go away and back to normal?

    jbc22681 wrote:
    Please give me any other information that you can on how to fix this.
    See  Display Shows White Screen Here
    http://support.apple.com/kb/TS2771
    If no joy... Try letting the Battery Fully Drain... Then Charge the Device for at least 30 Minutes...
    If you try these Steps and you still have issues... Then a Visit to an Apple Store or AASP (Authorized Apple Service Provider) is the Next Step... Be sure to make an appointment first...

  • Spry menu hover: How to get rid of white box with "false"?

    Hi--
    I'm encountering an IE issue with a Spry vertical menu bar. When the user hovers over the submenu, white frames appear behind the submenu with the word "false" in them. Of course this doesn't happen in Safari or Firefox.
    I was able to fix other similar problems with the menu by following tips posted on another forum. Namely, in the CSS, I disabled an IE hack that caused a white background to appear (menu background has to be transparent on this site). And in the JS, I disabled the following: this.removeIframeLayer(menu);
    Here's the URL: http://www.qic-ec.org
    Below are the css (1) and js (2).
    Any help would be DEEPLY appreciated.
    Thank you
    Jackie
    CSS:
    @charset "UTF-8";
    /* SpryMenuBarVertical.css - Revision: Spry Preview Release 1.4 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
    ul.MenuBarVertical
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 6.2em;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are same fixed width as parent */
    ul.MenuBarVertical li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 6.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarVertical ul
    margin: -5% 0 0 95%;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 6.2em;
    left: -1000em;
    top: 0;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarVertical ul.MenuBarSubmenuVisible
    left: 0;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarVertical ul li
    width: 3em;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Outermost menu container has borders on all sides */
    ul.MenuBarVertical
    border: 0px solid #CCC;
    /* Submenu containers have borders on all sides */
    ul.MenuBarVertical ul
    border: 0px solid #CCC;
    /* Menu items are a transparent block with padding and no text decoration */
    ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #502977;
    text-decoration: none;
    border-bottom: 1px dotted #A88FC7;
    /* Menu items that have mouse over or focus have a transparent background and light purple text */
    ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
    color: #A88FC7;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a transparent background and light purple text */
    ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
        color: #A88FC7;
    ul.MenuBarVertical ul li a
    border: 0px;
    color: #006600;
      SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    /*ul.MenuBarVertical iframe
    position: absolute;
    z-index: 1010;
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
    /* ul.MenuBarVertical li.MenuBarItemIE
    display: inline;
    f\loat: left;
            background: #fff;
    JS:
    /* SpryMenuBar.js - Revision: Spry Preview Release 1.4 */
    // Copyright (c) 2006. Adobe Systems Incorporated.
    // All rights reserved.
    // Redistribution and use in source and binary forms, with or without
    // modification, are permitted provided that the following conditions are met:
    //   * Redistributions of source code must retain the above copyright notice,
    //     this list of conditions and the following disclaimer.
    //   * Redistributions in binary form must reproduce the above copyright notice,
    //     this list of conditions and the following disclaimer in the documentation
    //     and/or other materials provided with the distribution.
    //   * Neither the name of Adobe Systems Incorporated nor the names of its
    //     contributors may be used to endorse or promote products derived from this
    //     software without specific prior written permission.
    // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
    // AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
    // IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
    // ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
    // LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
    // CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
    // SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
    // INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
    // CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
    // ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
    // POSSIBILITY OF SUCH DAMAGE.
    SpryMenuBar.js
    This file handles the JavaScript for Spry Menu Bar.  You should have no need
    to edit this file.  Some highlights of the MenuBar object is that timers are
    used to keep submenus from showing up until the user has hovered over the parent
    menu item for some time, as well as a timer for when they leave a submenu to keep
    showing that submenu until the timer fires.
    var Spry;
    if(!Spry)
    Spry = {};
    if(!Spry.Widget)
    Spry.Widget = {};
    // Constructor for Menu Bar
    // element should be an ID of an unordered list (<ul> tag)
    // preloadImage1 and preloadImage2 are images for the rollover state of a menu
    Spry.Widget.MenuBar = function(element, opts)
    this.init(element, opts);
    Spry.Widget.MenuBar.prototype.init = function(element, opts)
    this.element = this.getElement(element);
    // represents the current (sub)menu we are operating on
    this.currMenu = null;
    var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))
    // bail on older unsupported browsers
    return;
    // load hover images now
    if(opts)
    for(var k in opts)
    var rollover = new Image;
    rollover.src = opts[k];
    if(this.element)
    this.currMenu = this.element;
    var items = this.element.getElementsByTagName('li');
    for(var i=0; i<items.length; i++)
    this.initialize(items[i], element, isie);
    if(isie)
    this.addClassName(items[i], "MenuBarItemIE");
    items[i].style.position = "static";
    if(isie)
    if(this.hasClassName(this.element, "MenuBarVertical"))
    this.element.style.position = "relative";
    var linkitems = this.element.getElementsByTagName('a');
    for(var i=0; i<linkitems.length; i++)
    linkitems[i].style.position = "relative";
    Spry.Widget.MenuBar.prototype.getElement = function(ele)
    if (ele && typeof ele == "string")
    return document.getElementById(ele);
    return ele;
    Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
    if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
    return false;
    return true;
    Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
    if (!ele || !className || this.hasClassName(ele, className))
    return;
    ele.className += (ele.className ? " " : "") + className;
    Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
    if (!ele || !className || !this.hasClassName(ele, className))
    return;
    ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    // addEventListener for Menu Bar
    // attach an event to a tag without creating obtrusive HTML code
    Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
    try
    if (element.addEventListener)
    element.addEventListener(eventType, handler, capture);
    else if (element.attachEvent)
    element.attachEvent('on' + eventType, handler);
    catch (e) {}
    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:false;';
    menu.parentNode.appendChild(layer);
    layer.style.left = menu.offsetLeft + 'px';
    layer.style.top = menu.offsetTop + 'px';
    layer.style.width = menu.offsetWidth + 'px';
    layer.style.height = menu.offsetHeight + 'px';
    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
    var layers = menu.parentNode.getElementsByTagName('iframe');
    while(layers.length > 0)
    layers[0].parentNode.removeChild(layers[0]);
    // clearMenus for Menu Bar
    // root is the top level unordered list (<ul> tag)
    Spry.Widget.MenuBar.prototype.clearMenus = function(root)
    var menus = root.getElementsByTagName('ul');
    for(var i=0; i<menus.length; i++)
    this.hideSubmenu(menus[i]);
    this.removeClassName(this.element, "MenuBarActive");
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
    return (navigator.vendor == 'Apple Computer, Inc.' && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget)));
    // showSubmenu for Menu Bar
    // set the proper CSS class on this menu to show it
    Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
    if(this.currMenu)
    this.clearMenus(this.currMenu);
    this.currMenu = null;
    if(menu)
    this.addClassName(menu, "MenuBarSubmenuVisible");
    if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
    if(!this.hasClassName(this.element, "MenuBarHorizontal") || menu.parentNode.parentNode != this.element)
    menu.style.top = menu.parentNode.offsetTop + 'px';
    if(typeof document.uniqueID != "undefined")
    this.createIframeLayer(menu);
    this.addClassName(this.element, "MenuBarActive");
    // hideSubmenu for Menu Bar
    // remove the proper CSS class on this menu to hide it
    Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
    if(menu)
    this.removeClassName(menu, "MenuBarSubmenuVisible");
    if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
    menu.style.top = '';
    menu.style.left = '';
    // this.removeIframeLayer(menu);
    // initialize for Menu Bar
    // create event listeners for the Menu Bar widget so we can properly
    // show and hide submenus
    Spry.Widget.MenuBar.prototype.initialize = function(listitem, element, isie)
    var opentime, closetime;
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = false;
    if(menu)
    this.addClassName(link, "MenuBarItemSubmenu");
    hasSubMenu = true;
    if(!isie)
    // define a simple function that comes standard in IE to determine
    // if a node is within another node
    listitem.contains = function(testNode)
    // this refers to the list item
    if(testNode == null)
    return false;
    if(testNode == this)
    return true;
    else
    return this.contains(testNode.parentNode);
    // need to save this for scope further down
    var self = this;
    this.addEventListener(listitem, 'mouseover', function(e)
    if(self.bubbledTextEvent())
    // ignore bubbled text events
    return;
    clearTimeout(closetime);
    if(self.currMenu == listitem)
    self.currMenu = null;
    // show menu highlighting
    self.addClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
    if(menu && !self.hasClassName(menu, "MenuBarSubmenuVisible"))
    opentime = window.setTimeout(function(){self.showSubmenu(menu);}, 250);
    }, false);
    this.addEventListener(listitem, 'mouseout', function(e)
    if(self.bubbledTextEvent())
    // ignore bubbled text events
    return;
    var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
    if(!listitem.contains(related))
    clearTimeout(opentime);
    self.currMenu = listitem;
    // remove menu highlighting
    self.removeClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
    if(menu)
    closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);
    }, false);

    Do you have any suggestions for how to adjust the JS so that the menu functions properly in IE? As I said, I upgraded to Spry 1.6.1 and uploaded the new CSS and JS and the problem is still there. The CSS is the same as in the previous version. The new JS is:
    // SpryMenuBar.js - version 0.12 - Spry Pre-Release 1.6.1
    var Spry; if (!Spry) Spry = {}; if (!Spry.Widget) Spry.Widget = {};
    Spry.BrowserSniff = function()
    var b = navigator.appName.toString();
    var up = navigator.platform.toString();
    var ua = navigator.userAgent.toString();
    this.mozilla = this.ie = this.opera = this.safari = false;
    var re_opera = /Opera.([0-9\.]*)/i;
    var re_msie = /MSIE.([0-9\.]*)/i;
    var re_gecko = /gecko/i;
    var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
    var r = false;
    if ( (r = ua.match(re_opera))) {
    this.opera = true;
    this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_msie))) {
    this.ie = true;
    this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_safari))) {
    this.safari = true;
    this.version = parseFloat(r[2]);
    } else if (ua.match(re_gecko)) {
    var re_gecko_version = /rv:\s*([0-9\.]+)/i;
    r = ua.match(re_gecko_version);
    this.mozilla = true;
    this.version = parseFloat(r[1]);
    this.windows = this.mac = this.linux = false;
    this.Platform = ua.match(/windows/i) ? "windows" :
    (ua.match(/linux/i) ? "linux" :
    (ua.match(/mac/i) ? "mac" :
    ua.match(/unix/i)? "unix" : "unknown"));
    this[this.Platform] = true;
    this.v = this.version;
    if (this.safari && this.mac && this.mozilla) {
    this.mozilla = false;
    Spry.is = new Spry.BrowserSniff();
    // Constructor for Menu Bar
    // element should be an ID of an unordered list (<ul> tag)
    // preloadImage1 and preloadImage2 are images for the rollover state of a menu
    Spry.Widget.MenuBar = function(element, opts)
    this.init(element, opts);
    Spry.Widget.MenuBar.prototype.init = function(element, opts)
    this.element = this.getElement(element);
    // represents the current (sub)menu we are operating on
    this.currMenu = null;
    this.showDelay = 250;
    this.hideDelay = 600;
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
    // bail on older unsupported browsers
    return;
    // Fix IE6 CSS images flicker
    if (Spry.is.ie && Spry.is.version < 7){
    try {
    document.execCommand("BackgroundImageCache", false, true);
    } catch(err) {}
    this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
    this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
    this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
    this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
    this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;
    this.hoverClass = 'MenuBarItemHover';
    this.subHoverClass = 'MenuBarItemSubmenuHover';
    this.subVisibleClass ='MenuBarSubmenuVisible';
    this.hasSubClass = 'MenuBarItemSubmenu';
    this.activeClass = 'MenuBarActive';
    this.isieClass = 'MenuBarItemIE';
    this.verticalClass = 'MenuBarVertical';
    this.horizontalClass = 'MenuBarHorizontal';
    this.enableKeyboardNavigation = true;
    this.hasFocus = false;
    // load hover images now
    if(opts)
    for(var k in opts)
    if (typeof this[k] == 'undefined')
    var rollover = new Image;
    rollover.src = opts[k];
    Spry.Widget.MenuBar.setOptions(this, opts);
    // safari doesn't support tabindex
    if (Spry.is.safari)
    this.enableKeyboardNavigation = false;
    if(this.element)
    this.currMenu = this.element;
    var items = this.element.getElementsByTagName('li');
    for(var i=0; i<items.length; i++)
    if (i > 0 && this.enableKeyboardNavigation)
    items[i].getElementsByTagName('a')[0].tabIndex='-1';
    this.initialize(items[i], element);
    if(Spry.is.ie)
    this.addClassName(items[i], this.isieClass);
    items[i].style.position = "static";
    if (this.enableKeyboardNavigation)
    var self = this;
    this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
    if(Spry.is.ie)
    if(this.hasClassName(this.element, this.verticalClass))
    this.element.style.position = "relative";
    var linkitems = this.element.getElementsByTagName('a');
    for(var i=0; i<linkitems.length; i++)
    linkitems[i].style.position = "relative";
    Spry.Widget.MenuBar.KEY_ESC = 27;
    Spry.Widget.MenuBar.KEY_UP = 38;
    Spry.Widget.MenuBar.KEY_DOWN = 40;
    Spry.Widget.MenuBar.KEY_LEFT = 37;
    Spry.Widget.MenuBar.KEY_RIGHT = 39;
    Spry.Widget.MenuBar.prototype.getElement = function(ele)
    if (ele && typeof ele == "string")
    return document.getElementById(ele);
    return ele;
    Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
    if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
    return false;
    return true;
    Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
    if (!ele || !className || this.hasClassName(ele, className))
    return;
    ele.className += (ele.className ? " " : "") + className;
    Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
    if (!ele || !className || !this.hasClassName(ele, className))
    return;
    ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    // addEventListener for Menu Bar
    // attach an event to a tag without creating obtrusive HTML code
    Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
    try
    if (element.addEventListener)
    element.addEventListener(eventType, handler, capture);
    else if (element.attachEvent)
    element.attachEvent('on' + eventType, handler);
    catch (e) {}
    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:""';
    layer.frameBorder = '0';
    layer.scrolling = 'no';
    menu.parentNode.appendChild(layer);
    layer.style.left = menu.offsetLeft + 'px';
    layer.style.top = menu.offsetTop + 'px';
    layer.style.width = menu.offsetWidth + 'px';
    layer.style.height = menu.offsetHeight + 'px';
    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
    var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
    while(layers.length > 0)
    layers[0].parentNode.removeChild(layers[0]);
    // clearMenus for Menu Bar
    // root is the top level unordered list (<ul> tag)
    Spry.Widget.MenuBar.prototype.clearMenus = function(root)
    var menus = root.getElementsByTagName('ul');
    for(var i=0; i<menus.length; i++)
    this.hideSubmenu(menus[i]);
    this.removeClassName(this.element, this.activeClass);
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
    return Spry.is.safari && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget));
    // showSubmenu for Menu Bar
    // set the proper CSS class on this menu to show it
    Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
    if(this.currMenu)
    this.clearMenus(this.currMenu);
    this.currMenu = null;
    if(menu)
    this.addClassName(menu, this.subVisibleClass);
    if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
    if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
    menu.style.top = menu.parentNode.offsetTop + 'px';
    if(Spry.is.ie && Spry.is.version < 7)
    this.createIframeLayer(menu);
    this.addClassName(this.element, this.activeClass);
    // hideSubmenu for Menu Bar
    // remove the proper CSS class on this menu to hide it
    Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
    if(menu)
    this.removeClassName(menu, this.subVisibleClass);
    if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
    menu.style.top = '';
    menu.style.left = '';
    if(Spry.is.ie && Spry.is.version < 7)
    this.removeIframeLayer(menu);
    // initialize for Menu Bar
    // create event listeners for the Menu Bar widget so we can properly
    // show and hide submenus
    Spry.Widget.MenuBar.prototype.initialize = function(listitem, element)
    var opentime, closetime;
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    if(menu)
    this.addClassName(link, this.hasSubClass);
    if(!Spry.is.ie)
    // define a simple function that comes standard in IE to determine
    // if a node is within another node
    listitem.contains = function(testNode)
    // this refers to the list item
    if(testNode == null)
    return false;
    if(testNode == this)
    return true;
    else
    return this.contains(testNode.parentNode);
    // need to save this for scope further down
    var self = this;
    this.addEventListener(listitem, 'mouseover', function(e){self.mouseOver(listitem, e);}, false);
    this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
    if (this.enableKeyboardNavigation)
    this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
    this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
    Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
    this.lastOpen = listitem.getElementsByTagName('a')[0];
    this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.hasFocus = true;
    Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
    this.clearSelection(listitem);
    Spry.Widget.MenuBar.prototype.clearSelection = function(el){
    //search any intersection with the current open element
    if (!this.lastOpen)
    return;
    if (el)
    el = el.getElementsByTagName('a')[0];
    // check children
    var item = this.lastOpen;
    while (item != this.element)
    var tmp = el;
    while (tmp != this.element)
    if (tmp == item)
    return;
    try{
    tmp = tmp.parentNode;
    }catch(err){break;}
    item = item.parentNode;
    var item = this.lastOpen;
    while (item != this.element)
    this.hideSubmenu(item.parentNode);
    var link = item.getElementsByTagName('a')[0];
    this.removeClassName(link, this.hoverClass);
    this.removeClassName(link, this.subHoverClass);
    item = item.parentNode;
    this.lastOpen = false;
    Spry.Widget.MenuBar.prototype.keyDown = function (e)
    if (!this.hasFocus)
    return;
    if (!this.lastOpen)
    this.hasFocus = false;
    return;
    var e = e|| event;
    var listitem = this.lastOpen.parentNode;
    var link = this.lastOpen;
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];
    if (!opts[3])
    opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;
    var found = 0;
    switch (e.keyCode){
    case this.upKeyCode:
    found = this.getElementForKey(opts, 'y', 1);
    break;
    case this.downKeyCode:
    found = this.getElementForKey(opts, 'y', -1);
    break;
    case this.leftKeyCode:
    found = this.getElementForKey(opts, 'x', 1);
    break;
    case this.rightKeyCode:
    found = this.getElementForKey(opts, 'x', -1);
    break;
    case this.escKeyCode:
    case 9:
    this.clearSelection();
    this.hasFocus = false;
    default: return;
    switch (found)
    case 0: return;
    case 1:
    //subopts
    this.mouseOver(listitem, e);
    break;
    case 2:
    //parent
    this.mouseOut(opts[2], e);
    break;
    case 3:
    case 4:
    // left - right
    this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    break;
    var link = opts[found].getElementsByTagName('a')[0];
    if (opts[found].nodeName.toLowerCase() == 'ul')
    opts[found] = opts[found].getElementsByTagName('li')[0];
    this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    opts[found].getElementsByTagName('a')[0].focus();
            //stop further event handling by the browser
    return Spry.Widget.MenuBar.stopPropagation(e);
    Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if (this.enableKeyboardNavigation)
    this.clearSelection(listitem);
    if(this.bubbledTextEvent())
    // ignore bubbled text events
    return;
    if (listitem.closetime)
    clearTimeout(listitem.closetime);
    if(this.currMenu == listitem)
    this.currMenu = null;
    // move the focus too
    if (this.hasFocus)
    link.focus();
    // show menu highlighting
    this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    if(menu && !this.hasClassName(menu, this.subHoverClass))
    var self = this;
    listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
    Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if(this.bubbledTextEvent())
    // ignore bubbled text events
    return;
    var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
    if(!listitem.contains(related))
    if (listitem.opentime)
    clearTimeout(listitem.opentime);
    this.currMenu = listitem;
    // remove menu highlighting
    this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    if(menu)
    var self = this;
    listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
    if (this.hasFocus)
    link.blur();
    Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
    var child = element[sibling];
    while (child && child.nodeName.toLowerCase() !='li')
    child = child[sibling];
    return child;
    Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
    var found = 0;
    var rect = Spry.Widget.MenuBar.getPosition;
    var ref = rect(els[found]);
    var hideSubmenu = false;
    //make the subelement visible to compute the position
    if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
    els[1].style.visibility = 'hidden';
    this.showSubmenu(els[1]);
    hideSubmenu = true;
    var isVert = this.hasClassName(this.element, this.verticalClass);
    var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;
    for (var i = 1; i < els.length; i++){
    //when navigating on the y axis in vertical menus, ignore children and parents
    if(prop=='y' && isVert && (i==1 || i==2))
    continue;
    //when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
    if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
    continue;
    if (els[i])
    var tmp = rect(els[i]);
    if ( (dir * tmp[prop]) < (dir * ref[prop]))
    ref = tmp;
    found = i;
    // hide back the submenu
    if (els[1] && hideSubmenu){
    this.hideSubmenu(els[1]);
    els[1].style.visibility =  '';
    return found;
    Spry.Widget.MenuBar.camelize = function(str)
    if (str.indexOf('-') == -1){
    return str;
    var oStringList = str.split('-');
    var isFirstEntry = true;
    var camelizedString = '';
    for(var i=0; i < oStringList.length; i++)
    if(oStringList[i].length>0)
    if(isFirstEntry)
    camelizedString = oStringList[i];
    isFirstEntry = false;
    else
    var s = oStringList[i];
    camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
    return camelizedString;
    Spry.Widget.MenuBar.getStyleProp = function(element, prop)
    var value;
    try
    if (element.style)
    value = element.style[Spry.Widget.MenuBar.camelize(prop)];
    if (!value)
    if (document.defaultView && document.defaultView.getComputedStyle)
    var css = document.defaultView.getComputedStyle(element, null);
    value = css ? css.getPropertyValue(prop) : null;
    else if (element.currentStyle)
    value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
    catch (e) {}
    return value == 'auto' ? null : value;
    Spry.Widget.MenuBar.getIntProp = function(element, prop)
    var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
    if (isNaN(a))
    return 0;
    return a;
    Spry.Widget.MenuBar.getPosition = function(el, doc)
    doc = doc || document;
    if (typeof(el) == 'string') {
    el = doc.getElementById(el);
    if (!el) {
    return false;
    if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
    //element must be visible to have a box
    return false;
    var ret = {x:0, y:0};
    var parent = null;
    var box;
    if (el.getBoundingClientRect) { // IE
    box = el.getBoundingClientRect();
    var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
    var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
    ret.x = box.left + scrollLeft;
    ret.y = box.top + scrollTop;
    } else if (doc.getBoxObjectFor) { // gecko
    box = doc.getBoxObjectFor(el);
    ret.x = box.x;
    ret.y = box.y;
    } else { // safari/opera
    ret.x = el.offsetLeft;
    ret.y = el.offsetTop;
    parent = el.offsetParent;
    if (parent != el) {
    while (parent) {
    ret.x += parent.offsetLeft;
    ret.y += parent.offsetTop;
    parent = parent.offsetParent;
    // opera & (safari absolute) incorrectly account for body offsetTop
    if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
    ret.y -= doc.body.offsetTop;
    if (el.parentNode)
    parent = el.parentNode;
    else
    parent = null;
    if (parent.nodeName){
    var cas = parent.nodeName.toUpperCase();
    while (parent && cas != 'BODY' && cas != 'HTML') {
    cas = parent.nodeName.toUpperCase();
    ret.x -= parent.scrollLeft;
    ret.y -= parent.scrollTop;
    if (parent.parentNode)
    parent = parent.parentNode;
    else
    parent = null;
    return ret;
    Spry.Widget.MenuBar.stopPropagation = function(ev)
    if (ev.stopPropagation)
    ev.stopPropagation();
    else
    ev.cancelBubble = true;
    if (ev.preventDefault)
    ev.preventDefault();
    else
    ev.returnValue = false;
    Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
    if (!optionsObj)
    return;
    for (var optionName in optionsObj)
    if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
    continue;
    obj[optionName] = optionsObj[optionName];

  • How to get rid of white border around Container Div (main box)?

    I have look and look for a solution but couldn't find one. I'm developing a website but the main issue is the white (I changed it black so you can see what I'm talking about)  border around the website when i go to preview it from DW to Google Chrome or Internet Explorer.
    I've tried everything! from setting body margins all to zero but nothing works... can anyone help me?!

    No that's not what I'm talking about, the black div bot on the top is what i put, I put the entire style.css code in my last post, I'm talking about the white border on the right inside the scroll bar.
    let me explain from the bottom, let say I don't put Margin: 0 under Body  in my style.css . I get a white (I made it Green to show you better) border around my entire webpage looking like this:
    so this made me curios because I wanted to know why it gave me this border without putting Margin: 0 under Body in my Style.css sheet. so i went to inspect element inside Google Chrome and saw this:
    I was shocked because it automatically added 8 px in Margin around the body. So I took all the advice i was given in this thread and put the Margin: 0 ; under Body in my Style.css Sheet and it did this:
    for Some reason it says Margin 0 in the inspect element under body but put a default white border there to the right....
    I have explained this the best way possible. PLEASE CAN ANYONE HELP ME?!
    ps. its doing this for all browsers so i know it not a chrome issue!

  • Spry menu hover in IE: How to get rid of white frame & "false"?

    Hi--
    I'm encountering an IE issue with a Spry vertical menu bar. When the user hovers over the submenu, white frames appear behind the submenu with the word "false" in them. Of course this doesn't happen in Safari or Firefox.
    I was able to fix other similar problems with the menu by following tips posted on another forum. Namely, in the CSS, I disabled an IE hack that caused a white background to appear (menu background has to be transparent on this site). And in the JS, I disabled the following: this.removeIframeLayer(menu);
    Here's the URL: http://www.qic-ec.org
    Below are the css (1) and js (2).
    Any help would be DEEPLY appreciated.
    Thank you
    Jackie
    CSS:
    @charset "UTF-8";
    /* SpryMenuBarVertical.css - Revision: Spry Preview Release 1.4 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
    ul.MenuBarVertical
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 6.2em;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are same fixed width as parent */
    ul.MenuBarVertical li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 6.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarVertical ul
    margin: -5% 0 0 95%;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 6.2em;
    left: -1000em;
    top: 0;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarVertical ul.MenuBarSubmenuVisible
    left: 0;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarVertical ul li
    width: 3em;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Outermost menu container has borders on all sides */
    ul.MenuBarVertical
    border: 0px solid #CCC;
    /* Submenu containers have borders on all sides */
    ul.MenuBarVertical ul
    border: 0px solid #CCC;
    /* Menu items are a transparent block with padding and no text decoration */
    ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    color: #502977;
    text-decoration: none;
    border-bottom: 1px dotted #A88FC7;
    /* Menu items that have mouse over or focus have a transparent background and light purple text */
    ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
    color: #A88FC7;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a transparent background and light purple text */
    ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
        color: #A88FC7;
    ul.MenuBarVertical ul li a
    border: 0px;
    color: #006600;
      SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    /*ul.MenuBarVertical iframe
    position: absolute;
    z-index: 1010;
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
    /* ul.MenuBarVertical li.MenuBarItemIE
    display: inline;
    f\loat: left;
            background: #fff;
    JS:
    /* SpryMenuBar.js - Revision: Spry Preview Release 1.4 */
    // Copyright (c) 2006. Adobe Systems Incorporated.
    // All rights reserved.
    // Redistribution and use in source and binary forms, with or without
    // modification, are permitted provided that the following conditions are met:
    //   * Redistributions of source code must retain the above copyright notice,
    //     this list of conditions and the following disclaimer.
    //   * Redistributions in binary form must reproduce the above copyright notice,
    //     this list of conditions and the following disclaimer in the documentation
    //     and/or other materials provided with the distribution.
    //   * Neither the name of Adobe Systems Incorporated nor the names of its
    //     contributors may be used to endorse or promote products derived from this
    //     software without specific prior written permission.
    // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
    // AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
    // IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
    // ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
    // LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
    // CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
    // SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
    // INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN
    // CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
    // ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
    // POSSIBILITY OF SUCH DAMAGE.
    SpryMenuBar.js
    This file handles the JavaScript for Spry Menu Bar.  You should have no need
    to edit this file.  Some highlights of the MenuBar object is that timers are
    used to keep submenus from showing up until the user has hovered over the parent
    menu item for some time, as well as a timer for when they leave a submenu to keep
    showing that submenu until the timer fires.
    var Spry;
    if(!Spry)
    Spry = {};
    if(!Spry.Widget)
    Spry.Widget = {};
    // Constructor for Menu Bar
    // element should be an ID of an unordered list (<ul> tag)
    // preloadImage1 and preloadImage2 are images for the rollover state of a menu
    Spry.Widget.MenuBar = function(element, opts)
    this.init(element, opts);
    Spry.Widget.MenuBar.prototype.init = function(element, opts)
    this.element = this.getElement(element);
    // represents the current (sub)menu we are operating on
    this.currMenu = null;
    var isie = (typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE');
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (isie && typeof document.uniqueID == 'undefined'))
    // bail on older unsupported browsers
    return;
    // load hover images now
    if(opts)
    for(var k in opts)
    var rollover = new Image;
    rollover.src = opts[k];
    if(this.element)
    this.currMenu = this.element;
    var items = this.element.getElementsByTagName('li');
    for(var i=0; i<items.length; i++)
    this.initialize(items[i], element, isie);
    if(isie)
    this.addClassName(items[i], "MenuBarItemIE");
    items[i].style.position = "static";
    if(isie)
    if(this.hasClassName(this.element, "MenuBarVertical"))
    this.element.style.position = "relative";
    var linkitems = this.element.getElementsByTagName('a');
    for(var i=0; i<linkitems.length; i++)
    linkitems[i].style.position = "relative";
    Spry.Widget.MenuBar.prototype.getElement = function(ele)
    if (ele && typeof ele == "string")
    return document.getElementById(ele);
    return ele;
    Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
    if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
    return false;
    return true;
    Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
    if (!ele || !className || this.hasClassName(ele, className))
    return;
    ele.className += (ele.className ? " " : "") + className;
    Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
    if (!ele || !className || !this.hasClassName(ele, className))
    return;
    ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    // addEventListener for Menu Bar
    // attach an event to a tag without creating obtrusive HTML code
    Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
    try
    if (element.addEventListener)
    element.addEventListener(eventType, handler, capture);
    else if (element.attachEvent)
    element.attachEvent('on' + eventType, handler);
    catch (e) {}
    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:false;';
    menu.parentNode.appendChild(layer);
    layer.style.left = menu.offsetLeft + 'px';
    layer.style.top = menu.offsetTop + 'px';
    layer.style.width = menu.offsetWidth + 'px';
    layer.style.height = menu.offsetHeight + 'px';
    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
    var layers = menu.parentNode.getElementsByTagName('iframe');
    while(layers.length > 0)
    layers[0].parentNode.removeChild(layers[0]);
    // clearMenus for Menu Bar
    // root is the top level unordered list (<ul> tag)
    Spry.Widget.MenuBar.prototype.clearMenus = function(root)
    var menus = root.getElementsByTagName('ul');
    for(var i=0; i<menus.length; i++)
    this.hideSubmenu(menus[i]);
    this.removeClassName(this.element, "MenuBarActive");
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
    return (navigator.vendor == 'Apple Computer, Inc.' && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget)));
    // showSubmenu for Menu Bar
    // set the proper CSS class on this menu to show it
    Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
    if(this.currMenu)
    this.clearMenus(this.currMenu);
    this.currMenu = null;
    if(menu)
    this.addClassName(menu, "MenuBarSubmenuVisible");
    if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
    if(!this.hasClassName(this.element, "MenuBarHorizontal") || menu.parentNode.parentNode != this.element)
    menu.style.top = menu.parentNode.offsetTop + 'px';
    if(typeof document.uniqueID != "undefined")
    this.createIframeLayer(menu);
    this.addClassName(this.element, "MenuBarActive");
    // hideSubmenu for Menu Bar
    // remove the proper CSS class on this menu to hide it
    Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
    if(menu)
    this.removeClassName(menu, "MenuBarSubmenuVisible");
    if(typeof document.all != 'undefined' && typeof window.opera == 'undefined' && navigator.vendor != 'KDE')
    menu.style.top = '';
    menu.style.left = '';
    // this.removeIframeLayer(menu);
    // initialize for Menu Bar
    // create event listeners for the Menu Bar widget so we can properly
    // show and hide submenus
    Spry.Widget.MenuBar.prototype.initialize = function(listitem, element, isie)
    var opentime, closetime;
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = false;
    if(menu)
    this.addClassName(link, "MenuBarItemSubmenu");
    hasSubMenu = true;
    if(!isie)
    // define a simple function that comes standard in IE to determine
    // if a node is within another node
    listitem.contains = function(testNode)
    // this refers to the list item
    if(testNode == null)
    return false;
    if(testNode == this)
    return true;
    else
    return this.contains(testNode.parentNode);
    // need to save this for scope further down
    var self = this;
    this.addEventListener(listitem, 'mouseover', function(e)
    if(self.bubbledTextEvent())
    // ignore bubbled text events
    return;
    clearTimeout(closetime);
    if(self.currMenu == listitem)
    self.currMenu = null;
    // show menu highlighting
    self.addClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
    if(menu && !self.hasClassName(menu, "MenuBarSubmenuVisible"))
    opentime = window.setTimeout(function(){self.showSubmenu(menu);}, 250);
    }, false);
    this.addEventListener(listitem, 'mouseout', function(e)
    if(self.bubbledTextEvent())
    // ignore bubbled text events
    return;
    var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
    if(!listitem.contains(related))
    clearTimeout(opentime);
    self.currMenu = listitem;
    // remove menu highlighting
    self.removeClassName(link, hasSubMenu ? "MenuBarItemSubmenuHover" : "MenuBarItemHover");
    if(menu)
    closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, 600);
    }, false);

    Oh, sorry, after I updated to 1.6.1 and uploaded the new code, I didn't post it here. Here it is (minus intro comments)--and it's still not working in IE (though I am testing on an older PC with IE 6). The problem only arises upon hovering.
    THANKS
    Jackie
    JS
    // SpryMenuBar.js - version 0.12 - Spry Pre-Release 1.6.1
    // Copyright (c) 2006. Adobe Systems Incorporated.
    // All rights reserved.
    var Spry; if (!Spry) Spry = {}; if (!Spry.Widget) Spry.Widget = {};
    Spry.BrowserSniff = function()
    var b = navigator.appName.toString();
    var up = navigator.platform.toString();
    var ua = navigator.userAgent.toString();
    this.mozilla = this.ie = this.opera = this.safari = false;
    var re_opera = /Opera.([0-9\.]*)/i;
    var re_msie = /MSIE.([0-9\.]*)/i;
    var re_gecko = /gecko/i;
    var re_safari = /(applewebkit|safari)\/([\d\.]*)/i;
    var r = false;
    if ( (r = ua.match(re_opera))) {
    this.opera = true;
    this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_msie))) {
    this.ie = true;
    this.version = parseFloat(r[1]);
    } else if ( (r = ua.match(re_safari))) {
    this.safari = true;
    this.version = parseFloat(r[2]);
    } else if (ua.match(re_gecko)) {
    var re_gecko_version = /rv:\s*([0-9\.]+)/i;
    r = ua.match(re_gecko_version);
    this.mozilla = true;
    this.version = parseFloat(r[1]);
    this.windows = this.mac = this.linux = false;
    this.Platform = ua.match(/windows/i) ? "windows" :
    (ua.match(/linux/i) ? "linux" :
    (ua.match(/mac/i) ? "mac" :
    ua.match(/unix/i)? "unix" : "unknown"));
    this[this.Platform] = true;
    this.v = this.version;
    if (this.safari && this.mac && this.mozilla) {
    this.mozilla = false;
    Spry.is = new Spry.BrowserSniff();
    // Constructor for Menu Bar
    // element should be an ID of an unordered list (<ul> tag)
    // preloadImage1 and preloadImage2 are images for the rollover state of a menu
    Spry.Widget.MenuBar = function(element, opts)
    this.init(element, opts);
    Spry.Widget.MenuBar.prototype.init = function(element, opts)
    this.element = this.getElement(element);
    // represents the current (sub)menu we are operating on
    this.currMenu = null;
    this.showDelay = 250;
    this.hideDelay = 600;
    if(typeof document.getElementById == 'undefined' || (navigator.vendor == 'Apple Computer, Inc.' && typeof window.XMLHttpRequest == 'undefined') || (Spry.is.ie && typeof document.uniqueID == 'undefined'))
    // bail on older unsupported browsers
    return;
    // Fix IE6 CSS images flicker
    if (Spry.is.ie && Spry.is.version < 7){
    try {
    document.execCommand("BackgroundImageCache", false, true);
    } catch(err) {}
    this.upKeyCode = Spry.Widget.MenuBar.KEY_UP;
    this.downKeyCode = Spry.Widget.MenuBar.KEY_DOWN;
    this.leftKeyCode = Spry.Widget.MenuBar.KEY_LEFT;
    this.rightKeyCode = Spry.Widget.MenuBar.KEY_RIGHT;
    this.escKeyCode = Spry.Widget.MenuBar.KEY_ESC;
    this.hoverClass = 'MenuBarItemHover';
    this.subHoverClass = 'MenuBarItemSubmenuHover';
    this.subVisibleClass ='MenuBarSubmenuVisible';
    this.hasSubClass = 'MenuBarItemSubmenu';
    this.activeClass = 'MenuBarActive';
    this.isieClass = 'MenuBarItemIE';
    this.verticalClass = 'MenuBarVertical';
    this.horizontalClass = 'MenuBarHorizontal';
    this.enableKeyboardNavigation = true;
    this.hasFocus = false;
    // load hover images now
    if(opts)
    for(var k in opts)
    if (typeof this[k] == 'undefined')
    var rollover = new Image;
    rollover.src = opts[k];
    Spry.Widget.MenuBar.setOptions(this, opts);
    // safari doesn't support tabindex
    if (Spry.is.safari)
    this.enableKeyboardNavigation = false;
    if(this.element)
    this.currMenu = this.element;
    var items = this.element.getElementsByTagName('li');
    for(var i=0; i<items.length; i++)
    if (i > 0 && this.enableKeyboardNavigation)
    items[i].getElementsByTagName('a')[0].tabIndex='-1';
    this.initialize(items[i], element);
    if(Spry.is.ie)
    this.addClassName(items[i], this.isieClass);
    items[i].style.position = "static";
    if (this.enableKeyboardNavigation)
    var self = this;
    this.addEventListener(document, 'keydown', function(e){self.keyDown(e); }, false);
    if(Spry.is.ie)
    if(this.hasClassName(this.element, this.verticalClass))
    this.element.style.position = "relative";
    var linkitems = this.element.getElementsByTagName('a');
    for(var i=0; i<linkitems.length; i++)
    linkitems[i].style.position = "relative";
    Spry.Widget.MenuBar.KEY_ESC = 27;
    Spry.Widget.MenuBar.KEY_UP = 38;
    Spry.Widget.MenuBar.KEY_DOWN = 40;
    Spry.Widget.MenuBar.KEY_LEFT = 37;
    Spry.Widget.MenuBar.KEY_RIGHT = 39;
    Spry.Widget.MenuBar.prototype.getElement = function(ele)
    if (ele && typeof ele == "string")
    return document.getElementById(ele);
    return ele;
    Spry.Widget.MenuBar.prototype.hasClassName = function(ele, className)
    if (!ele || !className || !ele.className || ele.className.search(new RegExp("\\b" + className + "\\b")) == -1)
    return false;
    return true;
    Spry.Widget.MenuBar.prototype.addClassName = function(ele, className)
    if (!ele || !className || this.hasClassName(ele, className))
    return;
    ele.className += (ele.className ? " " : "") + className;
    Spry.Widget.MenuBar.prototype.removeClassName = function(ele, className)
    if (!ele || !className || !this.hasClassName(ele, className))
    return;
    ele.className = ele.className.replace(new RegExp("\\s*\\b" + className + "\\b", "g"), "");
    // addEventListener for Menu Bar
    // attach an event to a tag without creating obtrusive HTML code
    Spry.Widget.MenuBar.prototype.addEventListener = function(element, eventType, handler, capture)
    try
    if (element.addEventListener)
    element.addEventListener(eventType, handler, capture);
    else if (element.attachEvent)
    element.attachEvent('on' + eventType, handler);
    catch (e) {}
    // createIframeLayer for Menu Bar
    // creates an IFRAME underneath a menu so that it will show above form controls and ActiveX
    Spry.Widget.MenuBar.prototype.createIframeLayer = function(menu)
    var layer = document.createElement('iframe');
    layer.tabIndex = '-1';
    layer.src = 'javascript:""';
    layer.frameBorder = '0';
    layer.scrolling = 'no';
    menu.parentNode.appendChild(layer);
    layer.style.left = menu.offsetLeft + 'px';
    layer.style.top = menu.offsetTop + 'px';
    layer.style.width = menu.offsetWidth + 'px';
    layer.style.height = menu.offsetHeight + 'px';
    // removeIframeLayer for Menu Bar
    // removes an IFRAME underneath a menu to reveal any form controls and ActiveX
    Spry.Widget.MenuBar.prototype.removeIframeLayer =  function(menu)
    var layers = ((menu == this.element) ? menu : menu.parentNode).getElementsByTagName('iframe');
    while(layers.length > 0)
    layers[0].parentNode.removeChild(layers[0]);
    // clearMenus for Menu Bar
    // root is the top level unordered list (<ul> tag)
    Spry.Widget.MenuBar.prototype.clearMenus = function(root)
    var menus = root.getElementsByTagName('ul');
    for(var i=0; i<menus.length; i++)
    this.hideSubmenu(menus[i]);
    this.removeClassName(this.element, this.activeClass);
    // bubbledTextEvent for Menu Bar
    // identify bubbled up text events in Safari so we can ignore them
    Spry.Widget.MenuBar.prototype.bubbledTextEvent = function()
    return Spry.is.safari && (event.target == event.relatedTarget.parentNode || (event.eventPhase == 3 && event.target.parentNode == event.relatedTarget));
    // showSubmenu for Menu Bar
    // set the proper CSS class on this menu to show it
    Spry.Widget.MenuBar.prototype.showSubmenu = function(menu)
    if(this.currMenu)
    this.clearMenus(this.currMenu);
    this.currMenu = null;
    if(menu)
    this.addClassName(menu, this.subVisibleClass);
    if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
    if(!this.hasClassName(this.element, this.horizontalClass) || menu.parentNode.parentNode != this.element)
    menu.style.top = menu.parentNode.offsetTop + 'px';
    if(Spry.is.ie && Spry.is.version < 7)
    this.createIframeLayer(menu);
    this.addClassName(this.element, this.activeClass);
    // hideSubmenu for Menu Bar
    // remove the proper CSS class on this menu to hide it
    Spry.Widget.MenuBar.prototype.hideSubmenu = function(menu)
    if(menu)
    this.removeClassName(menu, this.subVisibleClass);
    if(typeof document.all != 'undefined' && !Spry.is.opera && navigator.vendor != 'KDE')
    menu.style.top = '';
    menu.style.left = '';
    if(Spry.is.ie && Spry.is.version < 7)
    this.removeIframeLayer(menu);
    // initialize for Menu Bar
    // create event listeners for the Menu Bar widget so we can properly
    // show and hide submenus
    Spry.Widget.MenuBar.prototype.initialize = function(listitem, element)
    var opentime, closetime;
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    if(menu)
    this.addClassName(link, this.hasSubClass);
    if(!Spry.is.ie)
    // define a simple function that comes standard in IE to determine
    // if a node is within another node
    listitem.contains = function(testNode)
    // this refers to the list item
    if(testNode == null)
    return false;
    if(testNode == this)
    return true;
    else
    return this.contains(testNode.parentNode);
    // need to save this for scope further down
    var self = this;
    this.addEventListener(listitem, 'mouseover', function(e){self.mouseOver(listitem, e);}, false);
    this.addEventListener(listitem, 'mouseout', function(e){if (self.enableKeyboardNavigation) self.clearSelection(); self.mouseOut(listitem, e);}, false);
    if (this.enableKeyboardNavigation)
    this.addEventListener(link, 'blur', function(e){self.onBlur(listitem);}, false);
    this.addEventListener(link, 'focus', function(e){self.keyFocus(listitem, e);}, false);
    Spry.Widget.MenuBar.prototype.keyFocus = function (listitem, e)
    this.lastOpen = listitem.getElementsByTagName('a')[0];
    this.addClassName(this.lastOpen, listitem.getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.hasFocus = true;
    Spry.Widget.MenuBar.prototype.onBlur = function (listitem)
    this.clearSelection(listitem);
    Spry.Widget.MenuBar.prototype.clearSelection = function(el){
    //search any intersection with the current open element
    if (!this.lastOpen)
    return;
    if (el)
    el = el.getElementsByTagName('a')[0];
    // check children
    var item = this.lastOpen;
    while (item != this.element)
    var tmp = el;
    while (tmp != this.element)
    if (tmp == item)
    return;
    try{
    tmp = tmp.parentNode;
    }catch(err){break;}
    item = item.parentNode;
    var item = this.lastOpen;
    while (item != this.element)
    this.hideSubmenu(item.parentNode);
    var link = item.getElementsByTagName('a')[0];
    this.removeClassName(link, this.hoverClass);
    this.removeClassName(link, this.subHoverClass);
    item = item.parentNode;
    this.lastOpen = false;
    Spry.Widget.MenuBar.prototype.keyDown = function (e)
    if (!this.hasFocus)
    return;
    if (!this.lastOpen)
    this.hasFocus = false;
    return;
    var e = e|| event;
    var listitem = this.lastOpen.parentNode;
    var link = this.lastOpen;
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    var opts = [listitem, menu, null, this.getSibling(listitem, 'previousSibling'), this.getSibling(listitem, 'nextSibling')];
    if (!opts[3])
    opts[2] = (listitem.parentNode.parentNode.nodeName.toLowerCase() == 'li')?listitem.parentNode.parentNode:null;
    var found = 0;
    switch (e.keyCode){
    case this.upKeyCode:
    found = this.getElementForKey(opts, 'y', 1);
    break;
    case this.downKeyCode:
    found = this.getElementForKey(opts, 'y', -1);
    break;
    case this.leftKeyCode:
    found = this.getElementForKey(opts, 'x', 1);
    break;
    case this.rightKeyCode:
    found = this.getElementForKey(opts, 'x', -1);
    break;
    case this.escKeyCode:
    case 9:
    this.clearSelection();
    this.hasFocus = false;
    default: return;
    switch (found)
    case 0: return;
    case 1:
    //subopts
    this.mouseOver(listitem, e);
    break;
    case 2:
    //parent
    this.mouseOut(opts[2], e);
    break;
    case 3:
    case 4:
    // left - right
    this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    break;
    var link = opts[found].getElementsByTagName('a')[0];
    if (opts[found].nodeName.toLowerCase() == 'ul')
    opts[found] = opts[found].getElementsByTagName('li')[0];
    this.addClassName(link, opts[found].getElementsByTagName('ul').length > 0 ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    opts[found].getElementsByTagName('a')[0].focus();
            //stop further event handling by the browser
    return Spry.Widget.MenuBar.stopPropagation(e);
    Spry.Widget.MenuBar.prototype.mouseOver = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if (this.enableKeyboardNavigation)
    this.clearSelection(listitem);
    if(this.bubbledTextEvent())
    // ignore bubbled text events
    return;
    if (listitem.closetime)
    clearTimeout(listitem.closetime);
    if(this.currMenu == listitem)
    this.currMenu = null;
    // move the focus too
    if (this.hasFocus)
    link.focus();
    // show menu highlighting
    this.addClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    this.lastOpen = link;
    if(menu && !this.hasClassName(menu, this.subHoverClass))
    var self = this;
    listitem.opentime = window.setTimeout(function(){self.showSubmenu(menu);}, this.showDelay);
    Spry.Widget.MenuBar.prototype.mouseOut = function (listitem, e)
    var link = listitem.getElementsByTagName('a')[0];
    var submenus = listitem.getElementsByTagName('ul');
    var menu = (submenus.length > 0 ? submenus[0] : null);
    var hasSubMenu = (menu) ? true : false;
    if(this.bubbledTextEvent())
    // ignore bubbled text events
    return;
    var related = (typeof e.relatedTarget != 'undefined' ? e.relatedTarget : e.toElement);
    if(!listitem.contains(related))
    if (listitem.opentime)
    clearTimeout(listitem.opentime);
    this.currMenu = listitem;
    // remove menu highlighting
    this.removeClassName(link, hasSubMenu ? this.subHoverClass : this.hoverClass);
    if(menu)
    var self = this;
    listitem.closetime = window.setTimeout(function(){self.hideSubmenu(menu);}, this.hideDelay);
    if (this.hasFocus)
    link.blur();
    Spry.Widget.MenuBar.prototype.getSibling = function(element, sibling)
    var child = element[sibling];
    while (child && child.nodeName.toLowerCase() !='li')
    child = child[sibling];
    return child;
    Spry.Widget.MenuBar.prototype.getElementForKey = function(els, prop, dir)
    var found = 0;
    var rect = Spry.Widget.MenuBar.getPosition;
    var ref = rect(els[found]);
    var hideSubmenu = false;
    //make the subelement visible to compute the position
    if (els[1] && !this.hasClassName(els[1], this.MenuBarSubmenuVisible))
    els[1].style.visibility = 'hidden';
    this.showSubmenu(els[1]);
    hideSubmenu = true;
    var isVert = this.hasClassName(this.element, this.verticalClass);
    var hasParent = els[0].parentNode.parentNode.nodeName.toLowerCase() == 'li' ? true : false;
    for (var i = 1; i < els.length; i++){
    //when navigating on the y axis in vertical menus, ignore children and parents
    if(prop=='y' && isVert && (i==1 || i==2))
    continue;
    //when navigationg on the x axis in the FIRST LEVEL of horizontal menus, ignore children and parents
    if(prop=='x' && !isVert && !hasParent && (i==1 || i==2))
    continue;
    if (els[i])
    var tmp = rect(els[i]);
    if ( (dir * tmp[prop]) < (dir * ref[prop]))
    ref = tmp;
    found = i;
    // hide back the submenu
    if (els[1] && hideSubmenu){
    this.hideSubmenu(els[1]);
    els[1].style.visibility =  '';
    return found;
    Spry.Widget.MenuBar.camelize = function(str)
    if (str.indexOf('-') == -1){
    return str;
    var oStringList = str.split('-');
    var isFirstEntry = true;
    var camelizedString = '';
    for(var i=0; i < oStringList.length; i++)
    if(oStringList[i].length>0)
    if(isFirstEntry)
    camelizedString = oStringList[i];
    isFirstEntry = false;
    else
    var s = oStringList[i];
    camelizedString += s.charAt(0).toUpperCase() + s.substring(1);
    return camelizedString;
    Spry.Widget.MenuBar.getStyleProp = function(element, prop)
    var value;
    try
    if (element.style)
    value = element.style[Spry.Widget.MenuBar.camelize(prop)];
    if (!value)
    if (document.defaultView && document.defaultView.getComputedStyle)
    var css = document.defaultView.getComputedStyle(element, null);
    value = css ? css.getPropertyValue(prop) : null;
    else if (element.currentStyle)
    value = element.currentStyle[Spry.Widget.MenuBar.camelize(prop)];
    catch (e) {}
    return value == 'auto' ? null : value;
    Spry.Widget.MenuBar.getIntProp = function(element, prop)
    var a = parseInt(Spry.Widget.MenuBar.getStyleProp(element, prop),10);
    if (isNaN(a))
    return 0;
    return a;
    Spry.Widget.MenuBar.getPosition = function(el, doc)
    doc = doc || document;
    if (typeof(el) == 'string') {
    el = doc.getElementById(el);
    if (!el) {
    return false;
    if (el.parentNode === null || Spry.Widget.MenuBar.getStyleProp(el, 'display') == 'none') {
    //element must be visible to have a box
    return false;
    var ret = {x:0, y:0};
    var parent = null;
    var box;
    if (el.getBoundingClientRect) { // IE
    box = el.getBoundingClientRect();
    var scrollTop = doc.documentElement.scrollTop || doc.body.scrollTop;
    var scrollLeft = doc.documentElement.scrollLeft || doc.body.scrollLeft;
    ret.x = box.left + scrollLeft;
    ret.y = box.top + scrollTop;
    } else if (doc.getBoxObjectFor) { // gecko
    box = doc.getBoxObjectFor(el);
    ret.x = box.x;
    ret.y = box.y;
    } else { // safari/opera
    ret.x = el.offsetLeft;
    ret.y = el.offsetTop;
    parent = el.offsetParent;
    if (parent != el) {
    while (parent) {
    ret.x += parent.offsetLeft;
    ret.y += parent.offsetTop;
    parent = parent.offsetParent;
    // opera & (safari absolute) incorrectly account for body offsetTop
    if (Spry.is.opera || Spry.is.safari && Spry.Widget.MenuBar.getStyleProp(el, 'position') == 'absolute')
    ret.y -= doc.body.offsetTop;
    if (el.parentNode)
    parent = el.parentNode;
    else
    parent = null;
    if (parent.nodeName){
    var cas = parent.nodeName.toUpperCase();
    while (parent && cas != 'BODY' && cas != 'HTML') {
    cas = parent.nodeName.toUpperCase();
    ret.x -= parent.scrollLeft;
    ret.y -= parent.scrollTop;
    if (parent.parentNode)
    parent = parent.parentNode;
    else
    parent = null;
    return ret;
    Spry.Widget.MenuBar.stopPropagation = function(ev)
    if (ev.stopPropagation)
    ev.stopPropagation();
    else
    ev.cancelBubble = true;
    if (ev.preventDefault)
    ev.preventDefault();
    else
    ev.returnValue = false;
    Spry.Widget.MenuBar.setOptions = function(obj, optionsObj, ignoreUndefinedProps)
    if (!optionsObj)
    return;
    for (var optionName in optionsObj)
    if (ignoreUndefinedProps && optionsObj[optionName] == undefined)
    continue;
    obj[optionName] = optionsObj[optionName];
    CSS
    @charset "UTF-8";
    /* SpryMenuBarVertical.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, a fixed width box with no margin or padding */
    ul.MenuBarVertical
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 6.2em;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are same fixed width as parent */
    ul.MenuBarVertical li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 6.2em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarVertical ul
    margin: -5% 0 0 95%;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: absolute;
    z-index: 1020;
    cursor: default;
    width: 6.2em;
    left: -1000em;
    top: 0;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarVertical ul.MenuBarSubmenuVisible
    left: 0;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarVertical ul li
    width: 8.2em;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Outermost menu container has borders on all sides */
    ul.MenuBarVertical
    border: 0px solid #CCC;
    /* Submenu containers have borders on all sides */
    ul.MenuBarVertical ul
    border: 0px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarVertical a
    display: block;
    cursor: pointer;
    background-color: transparent;
    padding: 0.5em 0.75em;
    color: #502977;
    text-decoration: none;
    border-bottom: 1px dotted #A88FC7;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarVertical a:hover, ul.MenuBarVertical a:focus
    background-color: transparent;
    color: #A88FC7;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarVertical a.MenuBarItemHover, ul.MenuBarVertical a.MenuBarItemSubmenuHover, ul.MenuBarVertical a.MenuBarSubmenuVisible
    background-color: transparent;
    color: #A88FC7;
    ul.MenuBarVertical ul li a
    border: 0px;
    color: #006600;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarVertical a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    /*ul.MenuBarVertical iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
    /* ul.MenuBarVertical li.MenuBarItemIE
    display: inline;
    f\loat: left;
    background: #FFF;

Maybe you are looking for