4 Replies Latest reply on Aug 5, 2008 1:53 PM by Mark60480

    spry submenu positioning

    Mark60480
      I have a horizontal spry menu that takes the entire width of the page. There are submenus for each item that default to appearing below and extend to the right of each item. This is fine except for the last two items on the right whose submenus extend off the screen to the right. I've tried making a class to change the positioning of these last two submenus, but this changes their visibility to alway visible, instead of just when moused-over. Sorry if someone's answered this before, but I been searching and not found anything.

      Thanks!
        • 1. Re: spry submenu positioning
          Ben M Adobe Community Professional
          The only thing you could do is make the width of the menu smaller. There really is not a way you can position the menu differently because the pop-out is controlled by javascript so not only would the item need its own class but it would need its own javascript to function.

          If you need help implementing the menu into something like the above you can post your code or a link to your page and someone here should be able to walk you through steps to getting your menu working as you need it to.
          • 2. Re: spry submenu positioning
            Mark60480 Level 1
            Thanks so much for your response. Here is a link to the page as it stands:
            http://markmaclean.com/sarahBackstage/index.html

            Also, here is a link to the page that my client wanted her nav bar fashioned after. This site is using something that controls the positioning of the 4 rightmost nav buttons.
            http://www.colorado.edu

            Any help is greatly appreciated! http://markmaclean.com/sarahBackstage/index.html http://www.colorado.edu
            • 3. Re: spry submenu positioning
              Ben M Adobe Community Professional
              I did some research and ironically enough I ended up back in the Dreamweaver Help (F1). If you search for "Customize Menu Bar" you will see an option to "Customize the Menu Bar Widget". The bottom option will position submenus. However, you cannot just change that. You will need to create a separate class for these few submenus so that their position is altered, thus creating the effect that they stay within the borders of the page.

              The only thing I would recommend though is updating your Spry (your version 1.4, current version 1.6.1). The download is available at the official Spry homepage:

              http://labs.adobe.com/technologies/spry/home.html

              The download will give you a bunch of samples and an Extension. Once you install the extension start up DW and you will see a new menu option under Sites which is to update your Spry. This will update the SpryAssets folder and then that folder should be re-uploaded to your site. I'm only suggesting this because the documentation online at that site is written using the 1.6.1 release and not the 1.4 release and I don't want to make more of a mess by changing something that could cause a problem in an earlier release.
              • 4. Re: spry submenu positioning
                Mark60480 Level 1
                I did download and install the 1.6.1 update. However when I applied it to the site it removed all of my previous formatting - but if it solves my issue I'll be happy to re-do some work. I already know how to reposition the submenus, which of course repositions all of them - and I have already created a separate class for the 2 menus I need to appear differently. My problem is that when I reposition them with the class, it alters their visibility (that is they are always visible as opposed to not just on mouse-over). I have also played with their visibility state in the class which resulted "hidden" keeps it hidden even when moused-over, "inherit" and "visible" make it always visible. In other words, the mouse-over is ignored. I think what I need is some help with the CSS code. Somehow specifying the mouse-over tag as opposed to the submenu tag? Here is the CSS class I am using:


                Once again, thanks so much for your help.