Spry Submenus Rolling Up in Multiple Broswers

Hi!
I'm trying to implement the spry menu on a website but it wont work for me. When you hover over the submenus they flicker and a submenu disappers. Here's a link to a page with this happening:
http://celebrationsphotography.us/contact_test.html
Thank you for your assistance!!!
hdksmith07

Please address the following first http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmyareasbest.com%2FMI%2520cities%2 FTraverse-City.html

Similar Messages

  • Spry submenus not working while Included with SSI

    I have customized and created my horizontal spry menu bar with the help of some tutorials on here, and I have pasted it onto a page without any html, head, or body tags. I have linked to the CSS files and javascript files in both the page being included and the page containing the include. But the Spry submenus wont work on the page with the include on it. But they work on the page being included.
    I tried only referencing the javascript file with the page containing the include, and vice versa to no avail. Again, everything else works except the expansion of the submenus.
    I am new to all of this, I only know what I have learned from doing tutorials and reading forums on this fabulous website. Has anyone encountered this problem or have a remedy? Thanks in advance.

    I'm confused. The submenus in the spry menu on the included page work when I don't reference the external style sheets or the javascript in the page containing the include. Based on the explanation given by David Powers on this thread about how to use SSI with Spry, I thought all pages had to include the link to the javscript and style sheets:
    http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSEE4C0148-A6F4-4bf5-9DEF-CE06AB026214a .html
    Problem solved? Or if anyone has an actual explanation for this, I will leave this question unanswered.
    Sorry to be so quick to post...

  • Spry Submenus Not Visible on RHS only

    My spry submenus work totally fine except for the very far
    right hand side of the page where the submenus are cut off. I can
    see the very beginning of the submenu but the rest of it with the
    text is hidden once it goes past the edge of the page. Clicking on
    the small part which is visible works, but users still need to see
    the entire submenu. This is a problem only in Firefox (3.0.7) and
    Safari (3.1.2). IE7 works fine where the submenus on the RHS are
    clearly visible as I hover and they extend past the right hand edge
    of the page. Thanks for any input.

    I could see it on Safari.. it has a Beatles poster on the Home page and then others on the other pages...
    Some flucky things happen with these browsers.
    Peace,
    Glen
    iMac G3, G4, G5 Powerbook   Mac OS X (10.4.4)   iPods

  • Spry Submenus falling all over themselves

    What property do I need to adjust to space out my spry submenus?
    I have submenus that need to have more then 5 or 6 words, they are both piling up on top of each other and expanding past the bounds of the background.
    Help! please
    Thanks.

    It's hard to say without seeing what you're trying to do.
    It's always best to provide a link to your page - upload *all* the files to a server and post a link.

  • Spry Submenus won't appear on one page, but they will another

    I have used Spry menu bars on sites before, but this is the
    first time I have had a problem like this. I make the spry menu bar
    on its own page and then use it as an include in a div tag on my
    site. When I preview the Spry Menu Bar in its own page, it works
    fine, and submenus work also. But when I have it in the page,
    everything works except the submenus will not come out. Any ideas?
    I attached the spry menu bar code (which works on its own), and my
    own page, where the spry is not working.

    Hi Rustyintegrale,
    A couple of questions...
    1. Does the unit immediately kernel panic when power from the bus hits the drive?
    2. Does it happen in multiple users?
    3. If you startup, interrupt the boot process and boot to the startup manager (by holding option on startup) and then plugin the SuperDrive does it kernel panic there as well?
    When a peripheral causes a unit to go into this state, there's little that can be done to troubleshoot from a software perspective. Especially if your answer to all three questions above was "yes." You can certainly try resetting the PRAM & SMC, to see if there is any change. But, I think the next best step might be to bring the machine and this optical drive to see a qualified technician.

  • IE displays spry submenus (incorrectly) at top of screen

    I apologize for asking this question, as it looks like it has been asked before, but I've spent hours trying to get my spry navigation bar to display correctly in Internet Explorer with no luck.  My project for school is due tomorrow and this is the ONLY thing that is preventing me from completing my project.  I'm practically in tears!
    I use a horizontal spry menu and the submenus don't drop down like they are supposed to.  They show up as separate navigation menus at the very top of the screen.
    What additional information do I need to provide?  My mentor was unable to help me because he uses a Mac and he can't test it.
    http://katiemieher.tripod.com/aychihuahuarescue
    Details below.
    Thanks!!
    Correct:
    Messed up by Internet Explorer:
    CSS:
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        padding: 0;
        list-style-type: none;
        cursor: default;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
        font-style: normal;
        font-variant: small-caps;
        text-align: center;
        line-height: normal;
        white-space: normal;
        margin-top: 0;
        margin-right: 100;
        margin-bottom: 0;
        margin-left: 0;
    /* 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: left;
        cursor: pointer;
        width: 120px;
        float: left;
        white-space: nowrap;
    /* 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: auto;
        position: absolute;
        left: -1000em;
        float: right;
    /* 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
        float: none;
        width: auto;
    /* 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
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        padding: 0.5em 0.75em;
        color: #F0F0F0;
        text-decoration: none;
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        color: #FFF;
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
    /* 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
        color: #FFF;
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
    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(../images/navbar_01.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    /* 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(../images/navbar_01.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    /* 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(../images/navbar_hover.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    /* 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(../images/navbar_hover.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    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;
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
    /* 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-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;

    Hi Katie,
    I understand. Here is a revised style sheet. I cannot verify it because I do not have version 1.4 on my computer. Please try it, make sure you keep a copy of your own style sheet in case. After installation please give me your feedback.
    @charset "UTF-8";
    ul.MenuBarHorizontal
        padding: 0;
            margin: 0;
        list-style-type: none;
        cursor: default;
        font-family: Verdana, Arial, Helvetica, sans-serif;
        font-size: 12px;
        font-weight: bold;
        font-style: normal;
        font-variant: small-caps;
        text-align: center;
    ul.MenuBarActive
        z-index: 1000;
    ul.MenuBarHorizontal li
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 120px;
        float: left;
    ul.MenuBarHorizontal ul
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        z-index: 1020;
        cursor: default;
        width: 120px;
        position: absolute;
        left: -1000em;
        float: right;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
        left: auto;
    ul.MenuBarHorizontal ul li
        width: 120px;
    ul.MenuBarHorizontal ul ul
        position: absolute;
        margin: -5% 0 0 95%;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    ul.MenuBarHorizontal ul
        border: 1px solid #CCC;
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        padding: 0.5em 0.75em;
        color: #F0F0F0;
        text-decoration: none;
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        color: #FFF;
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
        color: #FFF;
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
        background-image: url(../images/navbar_hover.gif);
        background-repeat: repeat-x;
        background-position: 0% 0%;
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
            filter:alpha(opacity:0.1);
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: left;
        background-image: url(../images/navbar_01.gif);
        background-repeat: repeat-x;
    Ben

  • Horizontal Spry submenus error in IE6

    I have searched every horizontal menu post on this forum for
    this answer. I have also edited every line in the CSS to see if it
    was causing this problem. I don't know enough CSS to think up my
    own CSS but have attempted some new things. My site is live and
    getting about 300 visitors a day. About 60% of them are still using
    IE6 so they are seeing my embarrassing disaster. I desperately need
    help.
    I designed and debugged my spry menu for Firefox and IE7.
    But they are not working on IE6. My horizontal menu at
    www.pocatellocvb.com pushes
    the page content down. I need to fix it ASAP.
    Here is my 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;
    width: 760px;
    white-space: nowrap;
    /* 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;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    float: left;
    width: auto;
    white-space: nowrap;
    padding-top: 0;
    padding-right: 2;
    padding-bottom: 0;
    padding-left: 2;
    /* 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: 8.2em;
    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: 8.2em;
    /* 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
    background: #FFF;
    border: 1px solid #000000;
    width: 210px;
    /* Menu items are a light gray block with padding and no text
    decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    padding: 0.5em 0.75em;
    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
    color: #C40000;
    /* 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
    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-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-repeat: no-repeat;
    background-position: 95% 50%;
    Thanks so much! Ann

    Hi,
    Sorry because I can't understand very well English and
    perhaps I will answer something that ... you know...
    But I tried your code, all like you have on your web, but
    adding the "BROWSER HACKS: the hacks below should not be changed
    unless you are an expert", and it works on IE6, IE7, FF2. Yes,
    without that, on IE6, the page breaks.
    You only need to add the last fragment that I understand you
    have deleted. It works without any other modification on css. You
    can update your version 1.4 to 1.6 too.
    I hope that I have understood all well.

  • Spry submenus overlap menu in Internet Explorer

    Hi, I'm working on a spry menu, and it looks exactly how i want it in Firefox, but in Explorer my submenus shift to the left and overlap my menu a lot.
    Also on my horizontal menu, the whole menu shows up shifted to the left and to the top in Explorer
    Here's the website
    http://myareasbest.com/MI%20cities/Traverse-City.html
    Heres my code for the vertical menu
    @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: 12px;
        cursor: default;
        width: 12em;
        border: none;
    /* 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
        list-style-type: none;
        font-size: 12px;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 12em;
        font-family: Verdana;
        font-style: normal;
        font-weight: bold;
        border:  2px solid #003399;
        height: 1.5em;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        margin-left: 0px;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 0;
        padding-left: 0;
    /* 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
        list-style-type: none;
        font-size: 12px;
        position: absolute;
        z-index: 1020;
        cursor: default;
        width: 12em;
        left: -1000em;
        top: 0;
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 0;
        margin-left: 75px;
        font-family: Verdana;
        font-style: normal;
        font-weight: bold;
        padding-top: 0;
        padding-right: 0;
        padding-bottom: 0;
        padding-left: 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: 12em;
        left: 75px;
        top: 5px;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Outermost menu container has borders on all sides */
    ul.MenuBarVertical
        border: none;
    /* Submenu containers have borders on all sides */
    ul.MenuBarVertical ul
        border: none;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarVertical a
        display: block;
        cursor: pointer;
        background-color: #01ACE2;
        color: #ffffff;
        text-decoration: none;
        height: 7px;
        width: 12em;
        padding-top: 0.5em;
        padding-right: 0;
        padding-bottom: 0.5em;
        padding-left: 0em;
        font-size: 100%;
    /* 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: #003385;
        color: #FFF;
    /* 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: #003385;
        color: #FFF;
    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;
    /* 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;
    Code for horizontal menu
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.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, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        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: 0px;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        text-align: left;
        cursor: pointer;
        width: 160px;
        float: left;
        left: 200px;
        top: 0px;
        height: 30px;
    /* 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: 160px;
        position: relative;
        left: -1000em;
            top: 0px;
    /* 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: -200;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
        width: 10em;
    /* 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: 0;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
        border: 0;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        background-color: #01ACE2;
        padding: 0.5em 0.75em;
        color: #FFFFFF;
        text-decoration: none;
        font-weight: bold;
        text-align: center;
        font-size: 16px;
        border: 2px solid #003399;
    /* 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: #003385;
        color: #FFF;
    /* 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: #003385;
        color: #FFF;
    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;
    /* 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;

    Please address the following first http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fmyareasbest.com%2FMI%2520cities%2 FTraverse-City.html

  • Spry submenus disappear on hover with jquery in IE6 only

    Help:  I thought I had everything working perfectly until trying this site in IE6:
    www.fstflorian.com/biolabs.html
    Things work perfectly in firefox 3, 3.5, IE7, google chrome, and IE8. IE6 causes the menu to disappear on rollover. I've worked on this for probably 10 hours since discovering the problem, adjusting z-index, etc etc to no avail, so I thought I would ask the experts.  The problem does not exist when jquery / supersized is not running.  I also discovered that changing from absolute positioning in the standard spry IE hack area begins to change whether/not the submenus disappear but the menu arrangement turns into a huge mess.
    I know my syntax isn't perfect... just trying to make things fully operational (site has gone live at least in limited function to meet deadline).  Later I will look for help on cleaning things up a bit.
    Thank you!

    Moderators:  Could you please remove this; it looks like I posted in the right place afterall.  I don't see a way to delete.
    Duplicate post is located here:  http://forums.adobe.com/thread/516522?tstart=0
    Very sorry for this.

  • Spry data region to display multiple data sources

    I'm developing an interactive menu using the Spry and Ajax framework that lists the menu items on the left (in a Spry accordion) to a corresponding image and description on the right. I have the basic functionality working, however, my menu items are broken into sub categories, and I can't seem to get my detail region to display attributes for more than 1 ds.
    My current status is here: http://bit.ly/PUG1y
    As you can see, my menu is broken into sections; i.e. Tapas, Pizzas, Entrees...etc. The Tapas secion works perfectly, and the Pizza section appears correctly on the left. However, I cannot get the detail region on the right to link to both Tapas and Pizzas. Right now I am trying to use separate XML files for each category, but could see my XML looking like this:
    <?xml version="1.0" encoding="UTF-8"?>
    <menu>
      <tapas>
           <item>
              <name>Fresh Tilapia Dip</name>
              <title>Fresh Tilapia Dip</title>
              <image>../one0one/images/food/crab_cakes.jpg</image>
              <desc>Mesquite Smoked Fresh Fish w/ Tortilla Chips and Pickled Jalapenos $6.99</desc>
           </item>
           <item>
                <name>Jamaican Jerk Chicken Satay</name>
              <title>Jamaican Jerk Chicken Satay</title>
              <image>../one0one/images/food/satay.jpg</image>
              <desc>Served with Pineapple Chutney w/ 101’s Spicy Tartar. $9.99</desc>
           </item>
        </tapas>
        <pizzas>
           <item>
                   <name>Pizza1</name>
                   <title>Pizza1</title>
                   <image>img.jpg</image>
                   <desc>description</desc>
           </item>                     
        </pizzas>
    </menu>
    I do not know how to set up the Spry regions to get this to work.  This seems like it should be pretty straightforward, but I have not had a lot of experience using Spry. What is the easiest/best practice method to get this to work correctly? Thanks for your help.

    I feel your pain... I was JUST running into the same issue and debated on using a similar menu for the restaurant site I did.
    Anyhow, here's how you do it. I solved it with this answer here: SOLVED: Multiple Data Sets (renamed)
    You can reference the source code here. Data Set Shell with Accordion
    The skinny version goes like this: You take your multiple data sets and combine them into one "Shell" using SpryDataSetShell.js
    Copy that to your Spry Assets folder and link to it alnog with your Accordian JS files.
    <script src="../../includes/SpryDataSetShell.js" type="text/javascript"></script>
    create a shell of all your datasets.
    var DATASET_2 = new Spry.Data.HTMLDataSet("../link_to_dataset", "Event_Table");
    var NEW_DATASET_SHELL = new Spry.Data.DataSetShell(dataMay);
    Then substitute your NEW_DATASET_SHELL in your code for the detail on the right
    <div spry:detailregion="NEW_DATASET_SHELL" class="YourContainer">
    Create an OnClick call in your accordian menu on the left...
    <div class="AccordionPanelContent" spry:region="DATASET_1"><p spry:repeat="DATASET_1" spry:setrow="DATASET_1" onclick="NEW_DATASET_SHELL.setInternalDataSet(DATASET_1, true);">{item} {item}</p></div>
    Do that for each of your accordian panels... Good Luck. Let me know if you need anything else.

  • Custom Spry Validation... Multiple Select

    http://www.mredkj.com/tutorials/tutorial005.html
    I am trying to have a 'multiple' select box where the user would enter answers to a trivia question.  It is the same concept as the example in the link.
    1.     User types answer in textfield
    2.     Hit "add"
    3.     javascript adds a new option in multiple select box with new answer.
    Would it be possible using spry to validate that a user at least enters 1 answer?  Max of 3?  I appreciate any direction or suggestions on a new approach!

    http://www.mredkj.com/tutorials/tutorial005.html
    I am trying to have a 'multiple' select box where the user would enter answers to a trivia question.  It is the same concept as the example in the link.
    1.     User types answer in textfield
    2.     Hit "add"
    3.     javascript adds a new option in multiple select box with new answer.
    Would it be possible using spry to validate that a user at least enters 1 answer?  Max of 3?  I appreciate any direction or suggestions on a new approach!

  • Spry Submenus Don't Disappear On Click

    I am trying to use Spry menus, but the submenus do not
    disappear on click. When a user selects a submenu item, the submenu
    stays open even after the user has made a selection. The user has
    to move the mouse away from the drop down menu in order for it to
    disappear. This is clumsy.
    What can I do to get around this? Any ideas?

    If it was designed that way, I think it is a design flaw.
    Once you click a selection on a submenu, you are done using
    the submenu, and it should go away. That is how most desktop
    software is designed.
    I'm using items on the menu as links to another page that
    appear in a DIV. The problem is, the submenu covers the top part of
    the DIV, and the user cannot see if it worked or not.
    How can we tell the Spry developers that submenus should
    disappear on click to make them more user-friendly?

  • Spry Submenus will not open

    I redid my web page design and layout and decided to add a
    spry menu with submenus. I have messed up somewhere and have
    searched for hours for a fix but haven't had any luck. My submenus
    were opening as white boxes with a false message. Now the submenus
    will not open at all. What do I need to fix? I am new to all of
    this CSS and am just learning as I go. Any help would be wonderful!
    http://www.allforuphotography.com

    I am unable to connect to my emails

  • Horizontal Spry submenus not dropping

    I created a horizontal spry menu for this site just as I have always done. but the dropdown submenus are not working. I have tried commenting out other "functional" pieces of code. I even put a spry meny into a blank document and uploaded it. I cannot figure out what I've done wrong. Any help would be great.
    You can see the page at http://www.rimshotcreative.com/test/web.html
    Here is the code:
    <!DOCTYPE HTML>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Rimshot Creative…Web Design, E-Commerce, Custom Web Development. Helping you find your groove.</title>
    <link href="RC.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="wt-rotator.css"/>
    <script type="text/javascript" src="js/jquery-latest.js"></script>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    </style>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css">
    <style type="text/css">
    <style type="text/css">
    h1,h2,h3,h4,h5,h6 {
              font-family: Verdana, Geneva, sans-serif;
    h4 {
              font-size: 40px;
              color: #FFF;
    body,td,th {
              font-family: Verdana, Geneva, sans-serif;
    h1 {
              color: #C00;
    body {
              background-image: url(Images/Secondary-backgrounds_01.jpg);
              background-repeat: repeat-x;
    </style>
    </head>
    <body>
    <div class="container2">
      <div class="Shadow">
      <div class="header"><a href="default.html"><img src="Images/RC-header_03.jpg" width="401" height="83" alt="Rimshot Creative Logo -  web design, print design, social networking, marketing, seo, printing, &amp; photography"></a><img src="Images/RC-header_04.jpg" width="291" height="83" alt="Rimshot Creative - "><img src="Images/RC-header_05.jpg" alt="Rimshot Creative - Free Consultation, call now (615) 482-5182" width="324" height="83"></div><!-- end .header -->
      <div class="main-image">
         <img src="Images/Exceptional-Design.png" width="631" height="293" alt="Exeptional Web Design"> </div>
      <div class="menu">
        <ul id="MenuBar1" class="MenuBarHorizontal">
          <li><a href="default.html" title="Home Page">home</a>        </li>
          <li><a href="web.html" title="web services" class="MenuBarItemSubmenu">web services</a>
            <ul>
              <li><a href="web.html" title="web design services">web design</a></li>
              <li><a href="seo.html" title="search engine marketing">seo</a></li>
              <li><a href="social.html" title="social media consultation">social media</a></li>
              <li><a href="email.html" title="email marketing">email marketing</a></li>
              <li><a href="hosting.html" title="web/email hosting">hosting</a></li>
            </ul>
          </li>
          <li><a href="print.html" title="print design services" class="MenuBarItemSubmenu">print services</a>
            <ul>
              <li><a href="print.html" title="print design services">print design</a>            </li>
              <li><a href="printing.html" title="printing services">printing</a></li>
              <li><a href="marketing.html" title="marketing services">marketing</a></li>
            </ul>
          </li>
          <li><a href="photography.html" title="photography">photography</a></li>
          <li><a href="gallery.html" class="MenuBarItemSubmenu">galleries</a>
            <ul>
              <li><a href="web_gallery.html" title="See Some of the Web Sites We've Built">web gallery</a></li>
              <li><a href="print_gallery.html" title="See Some of Our Print Design Work">print gallery</a></li>
              <li><a href="photography_gallery.html" title="See Some of Our Photography">photo gallery</a></li>
            </ul>
          </li>
    <li><a href="#" title="rimshot blog">blog</a></li>
    <li><a href="resources.html" title="resources">resources</a></li>
    <li><a href="testimonials.html" title="testimonials">testimonials</a></li>
        </ul>
      </div>
        <div class="right_column">
          <p><a href="Contact Form.html"javascript:void( window.open('http://form.jotform.us/form/21766576593165', 'blank','scrollbars=yes,toolbar=no,width=700,height=500'))</a><img src="Images/Free-Consultation-Button.png" width="252" height="57" alt="Request a Free Consultation from Rimshot Creative"></a></a><a href="http://www.bnitennessee.com/tn-middle-tennessee-(nashville)-focused-around-business-succes s/"><img src="Images/proud-member-grey.jpg" width="131" height="131" alt="Proud Member of BNI Focused Around Business Success Chapter - Columbia TN"></a></p>
    <p><a href="http://www.thumbtack.com/tn/brentwood/print-designers/#sort=popularity&hilite=3h88FmCa:V9o kA" title="Web &amp; Print Design Services" style="background: url(http://cdn-1.thumbtackstatic.com/media/elite_1.png) no-repeat; color: #a5a196; padding: 195px 0 0; border:0; font-size: 13px; font-family: Georgia, 'Times New Roman', Times, serif; text-align: center; text-decoration: none; display: inline-block; width:120px; line-height:15px;"><img src="http://cdn-1.thumbtackstatic.com/media/elite_1.png" style="display: none;" />Web Design, Print Design, Photography, Brentwood, Columbia, Franklin, Spring Hill, TN</a><br />
          </p>
          <h2>Follow or Share…<br />
            <a href="http://www.facebook.com/pages/Rimshot-Creative/251035548260903" target="_new"><img src="Images/facebook button.png" width="32" height="32" alt="Follow Rimshot Creative on Facebook" longdesc="http://www.facebook.com/profile.php?id=100002963257842" /></a><a href="https://twitter.com/rimshotcreative" target="_new"><img src="Images/twitter button.png" width="32" height="32" alt="Follow Rimshot Creative on Twitter" longdesc="https://twitter.com/#!/belleforest" /></a><a href="http://www.linkedin.com/in/rimshotwebdesign" target="_new"><img src="Images/linkedin.png" width="32" height="32" alt="Join Rimshot Creative on Linked In"></a><a href="http://pinterest.com/rimshotcreative/" target="_new"><img src="Images/pinterest.png" width="32" height="32" alt="Start Pinning with Rimshot Creative on Pinterest"></a><a href="https://plus.google.com/101386322992063777741/posts" target="_new"><img src="Images/googleplus.png" width="32" height="32" alt="Join Rimshot Creative's circle on Google Plus"></a><a href="http://youtu.be/75_xggIkLyk?hd=1" target="_new"><img src="Images/YouTube button.png" width="32" height="32" alt="Check out Rimshot Creative videos on YouTube"></a><!--<img src="Images/flickr.png" width="32" height="32" alt="See Rimshot Creative projects on Flickr">-->
            <p>
              <a href="https://plus.google.com/106267434027606674910/about?gl=US&hl=en-US" target="_new"><img src="Images/Google-Review-Button-No-Shadow.png" width="188" height="47" alt="Leave a review for Rimshot Creative on Google Places" /></a>
            <a href="http://local.yahoo.com/info-14947707"><img src="Images/Yahoo-Review-Button-No-Shadow.png" width="188" height="47" alt="Leave a review for Rimshot Creative on Yahoo Local" /></a></h2>
          <p>Rimshot Creative helps businesses find their groove through web design, print design, social networking, marketing, search engine optimization, printing, web and email hosting and photography in Nashville, Brentwood, Franklin, Thompsons Station, Spring Hill, Columbia, Mount Pleasant, Lewisberg, Hoenwald, Hampshire and all over Middle Tennessee.<br>
            <br>
          </p>
          <hr size="1">
          <p><strong><br>
            Rimshot Creative</strong><br>
          3313 Booker Farm Road<br>
          Mount Pleasant, TN 38474<br>
          Phone: (615) 482-5182<br>
          Fax:
          (615) 752-5956<br>
          <br>
          </p>
        </div>
        <div class="left_column">
          <h1>  Get Your Groove On!</h1>
    <p>Helping businesses find their groove is exactly what we try to do every day.</p>
          <h2>Layout</h2>
          <p>Since this is a one-column layout, the .content is not floated. </p>
          <h3>Logo Replacement</h3>
          <p>An image placeholder was used in this layout in the .header where you'll likely want to place  a logo. It is recommended that you remove the placeholder and replace it with your own linked logo. </p>
          <p> Be aware that if you use the Property inspector to navigate to your logo image using the SRC field (instead of removing and replacing the placeholder), you should remove the inline background and display properties. These inline styles are only used to make the logo placeholder show up in browsers for demonstration purposes. </p>
          <p>To remove the inline styles, make sure your CSS Styles panel is set to Current. Select the image, and in the Properties pane of the CSS Styles panel, right click and delete the display and background properties. (Of course, you can always go directly into the code and delete the inline styles from the image or placeholder there.)</p>
        </div>
        <div class="footer">
          <p>Footer</p>
          <!-- end .footer --></div>
          <!-- end .content --></div>
          <!-- end .shadow -->
    </div>
      <div class="addthis_bar addthis_bar_vertical addthis_bar_medium" style="top:200px;left:25px;">
    <div class="addthis_toolbox addthis_default_style addthis_32x32_style">
            <span><a class="addthis_button_preferred_1"></a></span>
            <span><a class="addthis_button_preferred_2"></a></span>
            <span><a class="addthis_button_preferred_3"></a></span>
            <span><a class="addthis_button_preferred_4"></a></span>
            <span><a class="addthis_button_compact"></a></span>
        </div>
    </div>
      <!-- end .container --></div>
      <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=[YOUR PROFILE ID HERE]"></script>

    Thanks for your help.
    It is not even on my local files. I would have thought that Dreamweaver would have created that in my local files. I can copy it over from one of my other sites.
    1. Do you have any idea why it would not have been created?
    2. What would be a way to resolve this if I didn't have this file on some of my other sites?
    3. How did you determin that the file was not found on the server. I haven't seen any errors with any of the tools that I've used to analyse the site.

  • Target Spry RowID on page with Multiple data sets from another page

    Hi all,
    I am trying to target a specific data item, on a page with
    multiple data sets, from a link on another page. (I also have to
    pass the link through Flash, but lets start with the simple
    part...)
    You can take a look at the site in progress here:
    http://www.3andband.com/TestSite/iframeTest3.html
    From the Home page I want to link to specific news or concert
    items on the News page
    I have been trying to get SpryURLUtils to do it but I can't
    seem to get it working.
    Any help would be greatly appreciated.
    Thanks!
    Ben

    did u try if it even passes the row value?? with a simple
    alert? alert(params.row)
    Also maby u need to reorder the scripts to this;
    <script src="../SpryAssets/SpryURLUtils.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/xpath.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryData.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryCollapsiblePanel.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryEffects.js"
    type="text/javascript"></script>
    <script src="../SpryAssets/SpryAccordion.js"
    type="text/javascript"></script>
    and your js script
    var params = Spry.Utils.getLocationParamsAsObject();
    var dsConcerts = new
    Spry.Data.XMLDataSet("includes/concerts.xml", "Concerts/concert");
    dsConcerts.setColumnType("image", "image");
    var dsNews = new Spry.Data.XMLDataSet("includes/news.xml",
    "News/item");
    //Set an observer so that when the data is loaded, we update
    the current row to the url param value
    dsNews.addObserver({ onPostLoad: function(ds, type) {
    dsNews.setCurrentRow(params.row); }
    function MM_effectBlind(targetElement, duration, from, to,
    toggle)
    Spry.Effect.DoBlind(targetElement, {duration: duration,
    from: from, to: to, toggle: toggle});
    So url params get loaded before the data

Maybe you are looking for

  • Rich Domain Model and Local JNDI Lookups

    Hi, I'm sure this is a problem a lot of other people have come across but there seems to be very little coherent discussion on the issue, so I'd very much appreciate any views people might have on the matter. The problem is whether or not you comprom

  • How to use txt files in jar file

    Hi all I just made a program that uses a text file, but I havent managed to work it correctly, program runs without jar correctly, but when I packaged all files into a jar, it couldnt find txt file, so I can only run it when I create another text fil

  • Cannot sync ATV1 Purchased Movies with iTunes

    I have recently purchased 5 movies via my ATV1.  I cannot sync or get my purchased movies into itunes.  They are not in my itunes folder and I have no available downloads. They used to always automatically appear in my iTunes folder, but not anymore.

  • 8520: problem to update OS 5

    Hello No possible to move my 8520 to OS5 Desktop offers me only OS4-6 or older version the same when I try updating online thank you for any help or tutoriel or information

  • How to create restore cd or recovery cd for macbook pro

    how to create a recovery cd or factory cd of macbook pro