SPRY dropdown menu dont appear in IE

I know its been asked to death but can someone give me a hint how to solve this. Have tried everything posted, updated to new spry 1.6 etc.
It jsut shows a white frame with the message: false, whr the menu is supposed to be.
www.dykningithailand.com/dansk/dykning-thailand.html
here is my css:
@charset "UTF-8";
/* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
body {
background-color:#4286C8;
padding:0;
margin:0;
text-align:center;
#wrapper {
margin: 0px auto;
padding: 0;
background-color:#000000;
width: 1000px;
text-align:left;
ul.MenuBarHorizontal
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 1000px;
background-color: #4286C8;
/* 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 a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: center;
z-index: 1020;
cursor: pointer;
width: 142px;
float: left;
background-color: #4286C8;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
top: 0
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 142px;
position: absolute;
left: -1000em;
background-color: #4286C8;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
top: 0;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 142px;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
background-color: #3170BF;
color: #FFFFFF;
text-decoration: none;
font-family: Tahoma, Geneva, sans-serif;
font-size: 10px;
font-weight: normal;
padding-top: 5px;
padding-bottom: 5px;
padding-right: 2px;
letter-spacing: 0.1em;
padding-left: 3px;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
background-color: #036;
color: #FFF;
font-weight: normal;
font-family: Tahoma, Geneva, sans-serif;
text-decoration: none;
font-size: 10px;
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-color: #036;
color: #FFF;
font-family: Tahoma, Geneva, sans-serif;
font-weight: normal;
text-decoration: none;
font-size: 10px;
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.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.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.MenuBarHorizontal 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.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.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.MenuBarHorizontal 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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

You have changed this style:
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
If you change left back to 0, it should work again. Notice that the comment states "we set left to 0 so it comes onto the screen".
Beth

Similar Messages

  • Spry Dropdown Menu properties hidden

    I am trying to create a spry dropdown menu but cannot see the light blue menu thing that you click on to edit the spry menu, and so therefore cannot edit it. It should pop up when you hover over the spry menu in design view but I get nothing. Please help

    See if this works:
    Place your cursor inside on of the menu items, look at the tag above the Property Inspector and you'll see the <ul.MenuBarHorizontal#MenuBar1> tag.
    (if it's a vertical menu, it'll say vertical instead of horizontal :-)
    Click on the tag  - does the editing box for the menu then show up?

  • IE 7 - CSS Issues with Spry dropdown Menu *HELP*

    I am using a spry horizontal dropdown menu generated in DW. The menus look consistant in all other browsers except ie7 -  When the drop down menu occurs they all appear to the right and not directly under its menu item.. Looked around in the Css and i cant seem to find the right rule to make the change in ie7 only... was planning on using a css conditional statement to shift them left.. But im not having any luck.. HELP!
    Thanks so much in advance!

    Sorry.. Here is the link.. Thanks so much for your willingness to help!
    http://soldesign.us/_working/WEBSITE_BoulderPlasticSurgery/index.html

  • Spry dropdown menu problem

    I've been working on a drop down menu for a site for a few
    months now. I'm using the Spry Widget. I can't seem to get it
    working right. I had used the drop down menu feature without
    problems in CS2, but now that I have CS3, I'm having problems. I
    use a Mac and am checking the site on a PC. The problem is in IE on
    the PC.
    Here is the site and page with the problem:
    http://www.nectfarmersmarket.org/farms.html
    The menu item "Participating Farms" has a drop down menu.
    Everything works fine on my Mac using FF and Safari. On the PC,
    using IE, only some of the links to the page anchors work in the
    drop down menu. The ones that don't work for me are: Duhamel Farm,
    Palazzi, Stone Farm, and Woodstock Farm.
    Since I assume it's user error :), today I recreated the page
    and the dropdown menu again from scratch:
    http://www.nectfarmersmarket.org/farmsC.html.
    And now more links don't work. These are the ones that don't work
    on this test page: Duhamel, Palazzi, Rachels, Stone and Woodstock.
    I have posted about this a while back, but I still can't
    figure it out and my client is getting a little impatient.
    TIA!

    In regards to the validation if you put that page through
    right now you will get a few errors. I will try to give them a
    quick rundown.
    - HR tags should look like <hr /> instead of <hr>
    which you have now. This is because there is no ending tag with HR
    tags so XHTML puts an end in the tag <hr />.
    -One error is a missing v in a closing div tag. You have
    </di> instead of </div>.
    -The final is with table tags, but with a quick glance I
    can't tell which tags are duplicate. Basically it appears as though
    there are one too many sets of closing tags. Would have to look
    closer at this to solve.
    In regards to the Drop-Down and anchors you may want to post
    this over at the Adobe Spry Forums because this is an odd issue and
    may be something that we have overlooked. So head over and post the
    link to the page so that they can see on that forum:
    http://www.adobe.com/go/labs_spry_pr1_forum
    Outside of that I really don't know what to say without
    rebuilding the menu from scratch and building a page locally on my
    test server which I won't really have time to do until probably the
    weekend and I know you want this solved as soon as possible. Wish
    there was more I could tell you but this has me stumped.

  • Spry Dropdown Menu problem in Mobile Safari (iPad)

    I've used the stack SpryMenuBar.js in Dreamweaver to create a dropdown menu for a client (XponentMD.com).
    When I Did a pass to optimize the site for the iPad, I found that the menu does not work properly. When you touch the top-level category, you go directly to the linked page and don't trigger the dropdown categories. I believe is it because the touch screen interface does not recognize focus and blur events.
    It there and updated version of the SpryMenuBar.js that accommodates touch screen browsers like mobile Safari?

    Thanks for your answers.
    Looks like the browser on iPad simulator doesn't behave like the real touch device, because on iPad itself definitely all unmodified Spry 2.0 menus and also that example ( http://nwneighborhoodvet.com/ ) don't work properly. When I touch "About Us" on http://nwneighborhoodvet.com/, then it immediately loads http://nwneighborhoodvet.com/pages/about-us.html instead of displaying the drop down menu.
    Somehow I also don't understand your versioning scheme. I downloaded today again the so called Spry 2.0 Dropdown Menu with the Widget Browser and when I install it on my site the directory with the CSS and Javascripts inside is called Spry-UI-1.7. When this is supposed to be Spry 2.0, why don't you call it Spry-UI-2.7 or 2.0.7 or something similar? Or do I get the wrong version from that strange Widget Browser/Dreamweaver CS5?
    My test page (should be unmodified and it's not formatted properly at the moment) is http://www.safeexambrowser.org/Templates/main-D.dwt, also doesn't work properly on iPad.
    This is a example (jQuery Superfish) which is actually working on iPad: http://users.tpg.com.au/j_birch/plugins/superfish/#examples (see the menu below "The result:".

  • Spry dropdown menu only works fully in Safari...

    http://www.charlespatrickjewelers.com/jewelry_pages/rings.html
    That is the link to my page. I have spry dropdowns set on the navbar for Rings, Bracelets, and watches.
    In IE and Firefox, only the rings dropdown is working, but for Safari every dropdown works. Can someone help me fix this?
    Thank you all!
    Aza

    Well, someone on another forum suggested I use css rollovers because both the spry and the swap image used the mouseover event, but I changed it and that didn't work. Can anyone here tell me why my spry navbar doesn't work in ie and Firefox?

  • Spry dropdown menu not dropping down and reversing order cs4

    Hi, thank you for reading my post.
    I am having problems with my spry menu bar not dropping down when
    I upload it to my site, I get bulleted lists. When I preview it, it works fine. Also, the menu is in reverse order (??) I've tried retyping it in the opposite order to see if that fixes it, but somehow it goes back to backwards. It should start with home at the left. I am trying to post my code, but it will not let me paste. How do I paste code? Sorry if thats a silly question.
    Thank you

    Hi, thank you for your replies. I set everything to left, which caused it to display correctly in dreamweaver. Thank you! I did enjoy the "wiggle" that I get from the menu items on hover, they move from right to left, will that cause problems if I change one back to right? I still am having trouble getting the menu bar to show on the website, Im still getting bullets.
    How do I put the css files? They might be on the site, but not in the right place, where should they be? I also made another site from the same template, and saved it to a folder in my site so it can be previewed. Will that cause problems? Both spry's are not working..... argh! Thank you to everyone for your help, I appreciate it, this is my first time using the spry menu feature. Thank you for the help on posting code. Here is a link to the site and the code:
    www.holly-parker.com
    JAVA:
    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:
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 14px;
    cursor: default;
    color: #FCC;
    background-color: #000;
    font-family: Verdana, Geneva, sans-serif;
    font-style: normal;
    font-weight: bold;
    text-align: center;
    float: left;
    width: 880px;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    position: relative;
    text-align: center;
    cursor: pointer;
    width: 145.8px;
    background-color: #000;
    color: #FCC;
    float: left;
    /* 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;
    background-color: #000;
    color: #FCC;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    z-index: 1020;
    cursor: default;
    width: 145.8px;
    position: absolute;
    left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
    color: #FCC;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
    width: 145.8px;
    clear: left;
    float: left;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: 0;
    top: 0;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
    border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-color: #000;
    padding: 0.5em 0.75em;
    color: #FCC;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    background-color: #333;
    color: #FFF;
    font-weight: bold;
    font-family: Verdana, Geneva, sans-serif;
    text-align: right;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-color: #000;
    color: #FCC;
    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.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    color: #FCC;
    /* 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.MenuBarHorizontal 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.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarDownHover.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.MenuBarHorizontal 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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: left;
    background: #000;
    Home page code:
    <!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>Holly Parker - Fashion, Commercial, Swim, Runway Model Los Angeles</title>
    <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="head" -->
    <!-- TemplateEndEditable -->
    <!-- TemplateBeginEditable name="mainstyling" -->
    <style type="text/css">
    <!--
    body {
    font: georgia;
    background: #FFF;
    margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
    padding: 0;
    text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
    color: #000;
    font-family: "Forgotten Futurist Shadow";
    background-image: url();
    background-color: #000;
    padding-top: 0px;
    .oneColFixCtrHdr #container {
    width: 1200px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
    background: #000000;
    margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
    border: 1px solid #000000;
    text-align: left; /* this overrides the text-align: center on the body element. */
    color: #FFF;
    .oneColFixCtrHdr #header {
    padding-top: 5px;
    padding-bottom: 0px;
    color: #FFF;
    background-color: #000;
    position: static;
    text-align: center;
    .oneColFixCtrHdr #header h1 {
    margin: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 60px;
    color: #F39;
    font-weight: bolder;
    text-align: center;
    margin-bottom: 0px;
    .oneColFixCtrHdr #mainContent {
    padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
    background: #FFFFFF;
    font-family: "SF Foxboro Script";
    color: #FFF;
    font-size: 18px;
    background-color: #000;
    font-weight: bold;
    text-align: center;
    padding-top: 0px;
    .oneColFixCtrHdr #footer {
    padding: 0 10px;
    color: #FCC;
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px;
    background-color: #000;
    text-align: center;
    .oneColFixCtrHdr #footer p {
    margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
    padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
    font-size: 10px;
    .navigation {
    background-color: #000;
    text-align: center;
    float: left;
    padding-left: 60px;
    -->
    </style>
    <!-- TemplateEndEditable -->
    <script src="file:///C|/Users/HOLLY/Desktop/Holly Parker Website/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="file:///C|/Users/HOLLY/Desktop/Holly Parker Website/SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body class="oneColFixCtrHdr">
    <div id="container">
      <div id="header">
        <h1><img src="images/holly-logo-top.jpg" width="875" height="139" /></h1>
        <table width="800" border="0" cellspacing="0" cellpadding="4">
          <tr>
            <td align="right" valign="middle" bgcolor="#FFE8FF" class="navigation"><!-- TemplateBeginEditable name="navieditable" -->
              <ul id="MenuBar1" class="MenuBarHorizontal">
                <li><a href="index.html">MAIN</a></li>
                <li><a href="pone.html" class="MenuBarItemSubmenu">PHOTOS</a>
                  <ul>
                    <li><a href="pone.html">Un</a></li>
                    <li><a href="ptwo.html">Deux</a></li>
                    <li><a href="pthree.html">Trois</a></li>
                    <li><a href="pfour.html">Quatre</a></li>
                  </ul>
                </li>
                <li><a href="me.html">ME</a>            </li>
                <li><a href="connect.html">CONNECT</a></li>
                <li><a href="links.html">LINKS</a></li>
                <li><a href="video.html">VIDEO</a></li>
              </ul>
            <!-- TemplateEndEditable --></td>
          </tr>
        </table>
        <!-- end #header -->
      </div>
      <div id="mainContent"><!-- TemplateBeginEditable name="bodyedit" -->
        <p><img src="images/holly-parker-pink-beauty-web.jpg" width="265" height="349" /></p>
      <!-- TemplateEndEditable -->
      <!-- end #mainContent --></div>
      <div id="footer"><!-- TemplateBeginEditable name="footeredit" -->
        <p>HOLLY PARKER  © 2010 ALL RIGHTS RESERVED  </p>
    <!-- TemplateEndEditable --></div></div>
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
    //-->
          </script>
    </body>
    </html>

  • Background image in Spry dropdown menu

    Hey everyone,
    I am at my wits end. I am converting an old table-based page to a css standards-compliant page and need to use a spry drop-down menu but can't get a background image to show up in the menu. If the top-most level has no submenu, then the background image shows up fine. But if I have a submenu, then no background image will display. I have put a background image in every place I can think of in the css for the menu, but it won't show up. I have googled for a solution, read the documentation on the spry menus, as well as searched through the Dreamweaver forum to no avail.
    Does anyone know how to do this? If it is not possible, can someone let me know that?
    Here is the page: http://www.sportplanesflorida.com/index_css.php (notice how the "Learn to Fly" tab has no background image).
    Thanks for your help.
    Mike

    remove the background-position:95% 50%; from your css.
    ul.MenuBarHorizontal a.MenuBarItemSubmenu {
         background-position:95% 50%;
         background-repeat:no-repeat;

  • Spry dropdown z-index problems in IE

    Hello
    I'm having some trouble with the spry horizontal dropdown in
    IE, and it's interaction with SmoothGallery. In every browser (with
    the exception on IE 6&7 of course) the higher z-index values of
    the menu cause it to overlay the JS image gallery below it. In IE
    however it does not.
    http://www.digitalrift.co.uk/projects/woods/
    Works fine on every browser tested so I can't see how it'd be
    a fault with the z-index values used. Anyone have a suggestion as
    to a workaround for good ol' IE?
    Thanks

    All right, well I just figured out my problem, and hopefully this will help anybody else. 
    I was positioning my images using <position: absolute;>  While this is definitely the easiest way to specifically place something on a page, Internet Explorer, it seems, assigns that z-value as the highest on the page, which is why my dropdown menus wouldn't appear on top of the image, but behind it. 
    The solution I found was changing the position attribute to "static" rather than "absolute".  The "static" attribute can't use position qualities like "top", "bottom", "left", and "right", but has to use margins and float to be specifically place. 
    While this isn't as easy as absolute positioning, using the static value will allow the Spry dropdown menu to appear over top of the images instead of behind them.

  • When I select an email address from the dropdown menu and hit return, Thunderbird then fills in a different email address. Yosemite upgrade?

    I just upgraded to OS X Yosemite and this new "feature" appeared. I often have several email addresses that contain the same set of characters. I just type the first few characters and then select the appropriate email address from the dropdown menu that appears. But if I hit return afterwards to enter another email address, the first address gets switched back automatically to the first one that appeared in the dropdown menu. The more characters I type, the more accurate it is, but it totally defeats the purpose of autofill if I have to type the entire email address! Anyone else having this problem? And can you guys please fix it? If you select something from the dropdown menu, it should stay selected.
    Thanks!

    This forum is filled with this same complaint. There is a bug reported on it. If and when they fix it is another question.
    Version 24.6 works if you want to go back to a working version.

  • Spry dropdown menus in Dreamweaver (CS 5.5) - how to make them smooth?

    Hello.  I received CS5.5 Master Collection this week and installed it.
    I am trying to add a Spry dropdown menu bar.
    That's easy enough, but I'm surprised that the menus just *pop* -- there's no smooth scrolling.
    Is there an easy way, using JavaScript or other means, to make these menus incorporate a smooth scroll-down effect?
    Thx!

    See Spry Transition effects.
    http://labs.adobe.com/technologies/spry/samples/effects/transition_sample.html
    Or look at jQuery Superfish with optional HoverIntent.js.
    http://users.tpg.com.au/j_birch/plugins/superfish/#examples
    Nancy O.
    web : print : graphics : media
    http://alt-web.com

  • How to add a dropdown menu to the search box (the 'search this site' box that appears on all subsites)

    Hello there,
    I know that in the search center you can add search verticals. Then you can configure the search box so it has a drop down menu so you can specify the result source you want to search. 
    But my question is about the 'search this site' box which appears on all subsites, so not the one in the search center. Is it possible to add the same dropdown menu to this box as in the search center?
    Thanks in advance!

    Hi,
    According to your post, my understanding is that you wanted to add a dropdown menu to the search box.
    You need to look at the Search Settings page that is located under the Site Collection Administration of the Site Settings.
    Here are some similar blogs for your reference:
    SharePoint 2013 Search Settings and Search drop down menu
    Customizing Search Navigation on a SharePoint 2013 Publishing Site  
    Best Regards,
    Linda Li
    Linda Li
    TechNet Community Support

  • Spry Horizontal Menu Submenus Won't Appear - Help

    OK, I have a Spry Horizontal Menu Bar done through DW CS5. The root menu items work just fine. And the arrow graphics indicating there are submenus are shown, however when you hover over the main menu item the submenus do not appear in browser preview. The spry menu bar is located in the header div above a main content div and a sidebar div (two column layout). Interestingly enough if I drop a new menu bar in the main content div with sample submenus it works fine, so the css file must be ok because they both read off the same css file.
    My only assumption is there is something in the header code which conflicts with the submenus and is not allowing the submenus to appear. Unfortunately I can't post it only in a test location as I am reworking an existing website and when I post the new css file it will obviously change the existing website.
    But here is some of the relevant code. First the HTML for the section in question.
    I very much appeciate any advice.
    Home     
    Biography
    Blog
    Riding
    Resources      
    Provincial
    Municipal
    Federal
    Education
    Community
    International
    Liberal Party
    Media      
    News Releases
    Newsletters
    Columns
    Photo Gallery
    Multimedia
    RSS Feeds
    Contact
    Now the CSS for the menu bar:
    @charset "UTF-8"; /* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */ ul.MenuBarHorizontal {      margin: auto;      padding: 0;      list-style-type: none;      font-family: "Times New Roman", Times, serif;      font-size: medium;      font-weight: bold;      cursor: default;      width: auto; } /* 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 a fixed width */ ul.MenuBarHorizontal li {      margin: 0;      padding: 0;      list-style-type: none;      font-size: 100%;      position: relative;      text-align: center;      cursor: pointer;      width: 108px;      float: left;      } /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ ul.MenuBarHorizontal ul {      margin: 0 0 0 50%;      padding: 0;      list-style-type: none;      font-size: 80%;      z-index: 1020;      cursor: default;      width: 108px;      float: none;      position: absolute;      left: -1000em; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible {      left: auto; } /* Menu item containers are same fixed width as parent */ ul.MenuBarHorizontal ul li {      width: 108px; } /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ ul.MenuBarHorizontal ul ul {      position: absolute;      margin: -5% 0 0 95%;      z-index:1030; } /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible {      left: none;      top: 0;      z-index:1040; } /******************************************************************************* DESIGN INFORMATION: describes color scheme, borders, fonts *******************************************************************************/ /* Submenu containers have borders on all sides */ ul.MenuBarHorizontal ul {      border: 1px solid #CCC;       } /* Menu items are a light gray block with padding and no text decoration */ ul.MenuBarHorizontal a {      display: block;      cursor: pointer;      background-color: #000;      padding: 5px 5px;      color: #FEFEFE;      text-decoration: none;       } /* Menu items that have mouse over or focus have a blue background and white text */ ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {      background-color: #323232;      color: #FEFEFE; } /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */ ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {      background-color: #323232;      color: #FEFEFE; } /******************************************************************************* 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.MenuBarHorizontal a.MenuBarItemSubmenu {      background-image: url(SpryMenuBarDown.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.MenuBarHorizontal 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.MenuBarHorizontal a.MenuBarItemSubmenuHover {      background-image: url(SpryMenuBarDownHover.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.MenuBarHorizontal 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.MenuBarHorizontal 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.MenuBarHorizontal li.MenuBarItemIE      {           display: inline;           f\loat: left;           background: #FFF;      } } 
    And lastly the Css code for the whole thing...
    @charset "utf-8"; body  {      font-family: Verdana, Geneva, sans-serif;      margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */      padding: 0;      text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */      }       .twoColFixLtHdr #container {      width: 760px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */      margin: 0 auto auto auto; /* the auto margins (in conjunction with a width) center the page */      border: 2px solid #000;      text-align: left; /* this overrides the text-align: center on the body element. */      }       .twoColFixLtHdr #header {            padding: 0;  /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */      border: 0px solid #000;             } .twoColFixLtHdr #header h1 {      margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */      padding: 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */       } .twoColFixLtHdr #sidebar1 {      float: left; /* since this element is floated, a width must be given */      width: 200px;      font-size:12px;      color:#FEFEFE;      background: #000;      border-top-width: 1px;      border-right-width: 2px;      border-bottom-width: 2px;      border-left-width: 1px;      border-top-style: solid;      border-right-style: solid;      border-bottom-style: solid;      border-left-style: solid;      border-top-color: #000;      border-right-color: #660000;      border-bottom-color: #000;      border-left-color: #000;      padding-top: 1px;      padding-right: 0px;      padding-bottom: 1px;      padding-left: 1px; } .twoColFixLtHdr #mainContent {      margin: 0 0 0 204px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */      padding: 0 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */      background:#660000;      } .twoColFixLtHdr #videomainContent {      margin: 0 0 0 200px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */      background: #323232;      padding-left:100px      } .twoColFixLtHdr #singleframe {      background: #323232;      }       .twoColFixLtHdr #footer {      padding: 0 10px 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */      font-size:12px;      color:#FEFEFE;      background:#000;      border: 1px solid #000;            } .twoColFixLtHdr #footer p {      margin: 0 0 0 270px; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */      padding: 20px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */ } .clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */      clear:both;     height:0;     font-size: 1px;     line-height: 0px; } br{font-size:10px} a:link {color:#FEFEFE} a:visited {color:#FEFEFE} a:hover {text-decoration:none;} #mainContent a:link {color:#000; text-decoration:none} #mainContent a:visited {color: #000; text-decoration:none} #mainContent a:hover {      text-decoration:underline; } #mainContent a:active {color:#000;text-decoration:none}   .red{     color:#4C0000;} .w1{font-size:14px;     color:#FEFEFE;} .w2{font-size:12px; color:#FEFEFE;} .w3{font-size:large; color:#FEFEFE;} .b1{font-size:14px; color: #000; font-weight:bolder} .sidehline{      float: left; /* since this element is floated, a width must be given */      width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */      padding: 0px 0px 0px 0px; }       .b{font-size:12px; color:#000000; } .topbtmmargin {      margin-top: 20px;      margin-bottom: 20px; } .SidebarPadding {      padding-top: 0px;      padding-right: 10px;      padding-bottom: 0px;      padding-left: 10px; } .FrontImage {      border: 5px ridge #323232;      float: left;      margin-right: 10px;      margin-bottom: 10px;      margin-top: 0px; } .FrontImageFltRgt {      border: 5px ridge #323232;     float: right;      margin-left: 10px;      margin-bottom: 10px;      margin-top: 20px; } .mapRgt {      float: right;      padding-left: 5px;      padding-bottom: 10px;      border: none;       } .sigRgt {      float: right;      padding-left: 5px;      margin-right: 60px;      padding-bottom: 10px;      margin-top: 10px;       } .textfntrgtcol {      padding-left: 200px;      font-size:12px;      color:#000000; } .textfntlftcol {      padding-right: 210px;      font-size:12px;      color:#000000; } .twoColFixLtHdr #container #mainContent ul li {      list-style-type: none;      list-style-position: outside;      list-style-image: url(images/blackbullet.gif); } .leftpicture {      border: 5px ridge #323232;      position: absolute;      z-index: 20;      height: 140px;      width: 180px;      margin-top: 10px;      margin-right: 10px;      margin-bottom: 10px;      margin-left: 210px;      left: 150px;      top: 326px; } img {      border-style: none; } .grooveimg {      border: groove; } #apDiv1 {      position:absolute;      width:200px;      height:115px;      z-index:1;      left: 0px;      top: 0px;      visibility: visible; } #apDiv2 {      position:absolute;      width:155px;      height:123px;      z-index:2;      left: 5px;      top: 4px;      visibility: visible; } #apDiv3 {      position:absolute;      width:335px;      height:122px;      z-index:3;      left: 173px;      top: 3px;      visibility: visible;      color:#FEFEFE; } #apDiv3 a:link {color:#FEFEFE} #apDiv3 a:visited {color: #FEFEFE} #apDiv3 a:hover {text-decoration:none;} #apDiv3 a:active {color:#FEFEFE} #apDiv4 {      position:absolute;      width:120px;      height:45px;      z-index:4;      left: 390px;      top: 105px;      visibility: visible; } #apDiv5 {      position:relative;      width:200px;      height:115px;      z-index:5; } .menubarWrapper {      background-color: #000;      float: left;      width: 100%; }

    Move the constructor for the menu bar up to read as follows
    <script type="text/javascript">
    <!--
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    swfobject.registerObject("FlashID2");
    swfobject.registerObject("FlashID2");
    swfobject.registerObject("FlashID3");
    //-->
    </script>
    Gramps

  • HT202213 The "Homeshare" option doesn't appear in the dropdown menu. How do I fix this?

    Both have the latest version of iTunes, both have Homesharing turned on, and both are authorized.  Why isn't Homesharing appearing in my options on the dropdown menu?  I'm at a deadend.
    If it helps, one computer has Windows 7 and the laptop has Windows 8.

    Have you seen the knowledgebase article already? http://support.apple.com/kb/ht4620

  • My bookmarks used to appear in dropdown menu from the address bar on my iMac G5. I switched to Mac Notebook & from Leopard to Lion. Now my bookmarks are not accessible from the address bar anymore (the line where you type in the website address)

    '''My bookmarks used to appear in dropdown menu from the address bar on my iMac G5. I switched to Mac Notebook & from Leopard to Lion. Now my bookmarks are not accessible from the address bar anymore (the line where you type in the website address)'''

    There appears to be a problem with Firefox 20 with UNC paths when using roaming profiles on a server.
    *[[/questions/955140]] why is the 20.0 address bar unresponsive?
    This is currently investigated and tracked via this bug report.
    *[https://bugzilla.mozilla.org/show_bug.cgi?id=857672 bug 857672] - Address Bar not working (roaming profiles;UNC path support OS.File)
    <i>(please do not comment in bug reports: [https://bugzilla.mozilla.org/page.cgi?id=etiquette.html])</i>

Maybe you are looking for