connect horizontal vertical spry menu

Hello

I'm a beginner, so maybe that's a stupid question... But here we go

Is it possible to 'connect' bars of horizontal and vertical menus between them?

I'll try to give an example...

The horizontal (main menu, in the header of the page) is:

Article 1 article 2 article 3 article 4

(void 1.1)      (as 2.1)

(in 1.2)      (under 2.2)

Now, when you click on one of the links, say "Sub 2.2", I would like to have the sidebar show this:

Point 2

void 2.1

void 2.2

subsub 2.2.1

SubSub 2.2.2

SubSub 2.2.3

void 2.3

...

Where 'Item 2' remains fixed as a title, and submarines form a menu accordion revealing sub-du submenu (you can open and jump on an another auxiliary by clicking on it)

Now, the easy way to do this is to create a separate page with a menu accordion separated in the sidebar for each of the 'Elements '. But this means that when I change something (add a submenu, change its name, change a link, etc.), I needed to change the pages separate as well.

Is there a not too complicated way of linking them together? So that the point 2 in the sidebar is not just a Word only a menu and the menu at the bottom. not separated, but refer to the horizontal menu located in the header? In other words, I would like to create a single list with 'Everything', 'Subs' and 'Sub subs"that I can see and use them in places and formats spry.

Thanks in advance!

Tom

Short answer, no way to do this with Spry menus.  Spry is also dead.  Adobe abandons this concept in 2012 and removed Spry in DW CC because he lost it utility and is not mobile friendly.

You might want to consider a different approach to navigation as a jQuery Mega Menu.

5 best jQuery CSS3 Mega navigation Menus | Marie Claude Chandonnet

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Vertical Spry Menu hiding behind content

    Hello

    I'm having a problem with my menu vertical spry.  I have a 3 column liquid and I put my spry menu is the far left column.  There are 2 submenus (so it should appear as a 3 column our menu fly).  The problem is that when the submenus to fly out, they are hidden behind the middle section fo the Web page column.

    I did not continue listing all the sub menu items as when I did for the first section, it has not worked.  A part of the fly of level 3 in East...

    • Adoption
      • Adoption in Queensland: stepparent Adoption
        • Step-Parent Adoption explained
        • Family Obtaiing court approval to open an Adoption procedure
      • Alternatives of step-Parent Adoption
    • Problems of children & parents

    You can see it at:

    http://www.diyfamilylawaustralia.com/default.html

    http://www.diyfamilylawaustralia.com/screen.CSS

    http://www.diyfamilylawaustralia.com/SpryAssets/SpryMenuBar.js

    http://www.diyfamilylawaustralia.com/SpryAssets/SpryMenuBarVertical.CSS

    Hoping someone can help me!

    See you soon

    Michelle

    Hi again,

    I solved my problem...

    I had in my css for the left column before it takes:

    overflow: visible;

    The overflow was hidden was causing the problem.

    Thank you all.

    See you soon

    Michelle

  • Need to justify horizontal of Spry Menu bar on the left

    I use DW CS6.  Menu bar horizontal Spry is in a div of fluid set grid on the page.

    The menu bar horizontal floated a CSS change left until what I did (I think).  It floats right now and I cannot figure out how to get back to float left.  Does anyone know a fix?

    Spry Menu CSS is:

    UL. MenuBarHorizontal

    {

    margin: 0;

    padding: 0;

    list-style-type: none;

    do-size: 100%;

    cursor: default;

    Width: auto;

    }

    and presentation of fluid grid CSS to div's

    {#menuHorizontal}

    Clear: both;

    float: left;

    left margin: 0;

    display: block;

    }

    Is the current page to the http://www.bedroomandmore.com/1_b_fluidGrid.html

    Thank you very much!

    Thank you Al,.

    Use the w3 validator I've corrected everything except one point, where it is said there was a string of code, when in fact there was only my tag closure at the bottom of the page.

    ... still can't seem to get the menu bar horizontal Spry back to left well aligned.

    Correction:

    I had css for fluid grid layout div for the bar of menus with a set width:

    {#menuHorizontal}

    Clear: both;

    float: left;

    left margin: 0;

    Width: 100%;

    display: block;

    }

    Thank you

    Eric

  • Vertical Spry menu bar does not work in IE 9

    Hello

    I hope someone can help me with this problem.

    This is the first time I made a website, but there are still some problems, especially with IE (when I use other browsers there no problem).

    The site I made is www.verdoncklaarne.be. When you click on the Menu to go to the submenu, submenu tis opens in leftcorner of the window.

    Is this a common problem? I'm still not fix.

    I hope someone can help me! (If you need more information just )

    Welcome,

    Ruth

    (Sorry my English)

    Hi Ruth,.

    usually you/we need to copy these files in a subdirectory of your / our web page, which is called "SpryAssets." BTW, you made reference to this directory in your source code, see here:

    .

    Hans G.

  • I need assistance with my BAR SPRY MENU *.

    Hello world

    I installed a Horizontal and Vertical Spry menu bar.
    It looks great, but I can't understand this.
    When I click on one of the links on the bars,

    my text jumps to the right

    Is someone can you please tell me how I can do

    the text to stop jumping.

    My test page is located on the link below:

    http://www.tonyasdynamicdesigns.com/gregs-pages/index.html

    Thank you very much for your help,
    Tonya

    Your text is not jumping to the right, it is such balance as specified by the attribute in your main style.css on line 409. (the selector a: active)

    Remove text-align: center;

  • Spry menu drop down behind youtube player please help

    Hello

    I have a vertical spry menu bar next to a youtube player on my site.  Fire Fox PC and IE the menu cache always behind the player.

    I have the reader in a separate div in the menu.  I tried to give the menu div a higher value of the hierarchy of the three and the reader div 1.

    When I tried to open the page after that I got an error before she would bring the screen to the top.

    I also tried to give the youtube html code a hierarchy within the div tag and once again got the error message.

    I also tried to make the position of 'visible', without success.

    Thank you for your time and help

    Kate Terry

    http://www.romanceinthebackseat.com

    "Wmode" is a setting of the Flash which is short for "window mode". You need to reset "allowScriptAccess" whatever the value was before you changed it to transparent and then add the wmode parameter. Here's how:

    1. In Dreamweaver design view, select the placeholder of the Flash.
    2. If you have Dreamweaver CS4, in the property inspector, change the contextual menu wmode transparent.
    3. For all other versions of Dreamweaver, click the settings button.
      1. In the settings dialog box, click Add (+) to insert another parameter.
      2. In the parameter column, enter wmode and press Tab.
      3. In the value column, enter transparent
      4. Click OK to close the settings dialog box.

    That should do it.

    Best - Joe

    Joseph Lowery

    Author, Dreamweaver CS4 Bible

  • THE problem with Horizontal Spry Menu

    I use a horizontal Spry menu on my new Web site of the office. In IE9, but on the subpage of the site, the submenu display strangely, fill a horizontal space rather than descend vertically. It works on the index page, and it seems to me that the divs and other circumstances are the same in each file. Any advice or assistance would be appreciated.

    An example of the arrangement of the subpage: http://test.faculty.umd.edu/teach/syllabus_ie.html Hovering above the menu should show the problem.

    The index page (showing how the menu works correctly): http://test.faculty.umd.edu/index_ie.html

    Thank you

    Rebecca

    The Spry menu that is built into Dreamweaver using older code that is not compatible with IE 9. If you want to use a Spry menu, you need to use Spry Menu 2.0, you can install using the browser Widget from Adobe. See http://www.adobe.com/devnet/dreamweaver/articles/spry_menu_bar.html.

    On the other hand, you might be better off looking for a different menu. There has been a lot of problems with Spry, and the framework has not been updated for several years.

  • Horizontal submenus Spry drop not vertical

    Please forgive me if there's a post answering the question of ths.  I went through about 20 posts and 2 tutorials that I thought that it would process without success. I use CS4 with Vista and ie7, I thought that my problem was the Flash video as the menu, but the problem still exists when I deleted the flash.

    I inserted a horizontal Spry menu with submenus, but the submenus drop horizontal and not vertical. (In the design of the menu display has a vertical drop). Take a look at the first and the third link for an example. http://gigharborrealestate.com/dw_question/

    Thank you

    The problem lies here:

    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;
    }
    

    You must assign a width for submenus. Otherwise, IE display these files directly horizontally.

  • How get rid of the line tight to the left side of a menu vertical spry?

    Hello

    I created a bar of menus vertical spry. Everything works but there is a line like this [around the left side of the menu. Does anyone know how to get rid of this?

    Thank you!

    Line 73 in your Spry css calls for a border

    UL. MenuBarVertical a {}

        border : 1px solid #ccc;

    }

    Delete the rule or replace the #fff #ccc

  • Horizontal Spry Menu pushing my content to the right

    Hello everyone. I am very new to Dreamweaver and so far I love the ease of use and how much I can do with it. However, I recently tried to add a spry menu bar - horizontally, but he pushed my content to the right of the page. The web page is www.iowapva.org

    Any help in getting this square far is greatly appreciated. I want to learn so if there is something false needs corrected or Advisor on fix the site, I'm open.

    Thank you

    Brad

    Add or change the following

    #page {}

    Clear: both;

    }

    UL. MenuBarHorizontal ul {}

    position: absolute;

    }

    Personally, I would add these just above the tag as in

  • How can I make the menu title of a different color when it is horizontal Spry menu menu?

    How can I make the menu title of a different color when it is horizontal Spry menu menu?

    Dreamweaver CS5.5

    Apple OS X.6.8

    Display of the site to: http://Dorsay-Easton-Indian-law.com/staging/index.html

    Steps to follow:

    1. click on the link to land on the home page

    2 link see Home in the Spry horizontal navigation menu

    Real:

    Title of the home menu is the same color as all the others.

    Expected:

    The title of the active menu is color: #FFC.

    I was hoping that a: active would give me this feature, but it's not how it is described. All suggestions are welcome!

    The tag BODY nothing that I tried in the editable model. This is why I wonder how to disconnect the model individual pages. Adding an ID to each body tag is a condition sine qua non of the how-to page that you provided.

    You are not theeditable in a template tag.

    You are the attributes of theeditable tag.

    Do not unplug the model child pages.

    Specify editable tag attributes in a template

    http://help.Adobe.com/en_US/Dreamweaver/CS/using/WScbb6b82af5544594822510a94ae8d65-7aa3a.h tml

    In the model:

    1. Select ittag (in the tag selector, or click inside the)tag in Code view)
    2. Modify > templates > make attribute editable
    3. Select the code in the drop down attribute
    4. If there is no ID attribute then click Add and type the ID in the next dialog box
    5. Attribute: ID
      Check the box 'Make attribute editable '.
      Enter anything in the field of the default label for example foo
      Ok
    6. Dreamweaver will change thetag to read
    7. The ID is now editable
    8. Save the model and update the child page

    In each page of the child:

    1. Edit > properties of the model
    2. Select the id attribute in the list (it's probably the only one listed)
    3. Change its name in the box to any name matches your CSS rule for the active state of the page
    4. Ok
    5. Save
    6. Download
  • Spry vertical navigation menu under

    I'm using the vertical navigation menu Spry, how to make the color of the different submenu in the main menu?

    Add the following style rule in your document, adjust the values according to

    UL. MenuBarHorizontal ul a {}
    background-color: purple;
    color: pink;
    }

    GRAMPS

    Sorry,

    UL. MenuBarVertical ul a {}
    background-color: purple;
    color: pink;
    }

    Post edited by: altruistic gramps

  • Using CSS - positioning horizontal spry menu

    I built a menu horizontal Spry amounting to 800 px of width and horizontally centered in a div.

    But I put the height of the menu bar to 2 ems to try to force the div parent having the same height as the menu bar. I don't think it's the right approach:

    (1) I read somewhere that it is not advisable to adjust the height of the menu items. and

    (2) to the opera (only tested in Opera, Safari, Firefox), I see a little extra high enough (in the gray area) under the Spry menu - I want the heights to exactly match, and actual size when a user resizes the text and the menu bar grows.

    2 EXAMPLES:

    http://stephencoren.com/SpryMenu/index.htm -I put height: 2ems; in the Spry ul menu rule. MenuBarHorizontal

    http://stephencoren.com/SpryMenu/index_2.htm , I removed the 2 height adjustment ems. In addition to losing the color of gray background to the left and right of the menu, the content area moves upward - I guess the distance 2 em I deleted

    QUESTIONS RELATING TO THE:

    (1) what I'm doing wrong? I think it's probably some basic CSS stuff that I'm not understand.

    (2) what should I do?

    You mean that you run Windows in a virtual machine or Parallels?

    http://www.VMware.com/products/fusion/

    http://www.parallels.com/products/desktop/

    You can't out-bug for IE without IE.

    Nancy O.
    ALT-Web Design & Publishing
    Web | Graphics | Print | Media specialists
    http://ALT-Web.com/
    http://Twitter.com/ALTWEB

  • Menu vertical Spry - can't get drop downs to work

    Hello

    I feel like a "retarded", but I can't get down to work at all.

    , I created a new page and insert a spry menu bar and the drop downs do not work. (They leave when you hover over them). http://www.mogulmarketing.com/test.asp

    At a customer site, I did a bit of style, which worked fine, but now the downs show drop all the time. What should I change in the CSS?

    http://67.199.64.241/indexspry.asp

    I want this site to be accessible; I'd love to work. The site is classic ASP / javascript.

    Thank you very much!!!

    Here's the SpryMenuBarVertical.css:

    @charset "UTF-8";

    / * SpryMenuBarVertical.css - version 0.6 - Pre - Release Spry 1.6.1 * /.

    / * Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

    /*******************************************************************************

    The AVAILABLE INFORMATION: Describes the box model, positioning, the order

    *******************************************************************************/

    / * The outermost container for the menu bar, a box of width fixed without margin or padding * /.
    UL. MenuBarVertical
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    do-size: 100%;
    cursor: default;
    Width: 14em;
    }
    / * Value of the menu bar active with this class, currently the definition of z-index to accommodate IE rendering bugs: http://therealcrisp.xs4all.nl/Meuk/IE-zindexbug.html */
    UL. MenuBarActive
    {
    z-index: 1000;
    }
    / * Menu item containers, position the children relative to this container and are the same fixed width parent * /.
    UL. MenuBarVertical li
    {
    margin: 0;
    padding: 0;
    list-style-type: none;
    do-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    Width: 14em;
    }
    / * Submenus should appear slightly overlapping to the right (95%) and upward (-5%) with a higher z-index, but they are first the left side of the screen (-1000em) * /.
    UL. MenuBarVertical ul
    {
    margin: 0 0 0 100%;
    list-style-type: none;
    do-size: 100%;
    position: absolute;
    z index: 1020;
    cursor: default;
    Width: 14.2em;
    / * left:-1000em; */
    top: 0;
    }
    / * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we have left to 0, it is on the screen * /.
    UL. MenuBarVertical ul. MenuBarSubmenuVisible
    {
    left: 0;
    }
    / * Container of menu items are same fixed width parent * /.
    UL. MenuBarVertical ul li
    {
    Width: 14.2em;
    }

    /*******************************************************************************

    INFORMATION DESIGN: Describes the set of colors, borders, fonts

    *******************************************************************************/

    / * Outermost menu container has borders on all sides * /.
    UL. MenuBarVertical
    {
    border: 1px solid #CCC;
    }
    / * Submenu containers have borders on all sides * /.
    UL. MenuBarVertical ul
    {
    border: 1px solid #CCC;
    }
    UL. MenuBarVertical a
    {
    display: block;
    cursor: pointer;
    background-color: #4e2029;
    Padding: 0.5em 0.75em;
    color: #fff;
    text-decoration: none;
    border-bottom-style: solid;
    border-bottom-color: #FFF;
    border-bottom-width: thin;
    }
    / Components menu that have mouse over or focus have a blue background and white text * /.
    UL. MenuBarVertical a: hover, ul. MenuBarVertical a: focus
    {
    background-color: #d5647c;
    color: #FFF;
    }
    / * Menu items that are opened with the submenus are on MenuBarItemHover with a blue background and white text * /.
    UL. MenuBarVertical a.MenuBarItemHover, ul. MenuBarVertical a.MenuBarItemSubmenuHover, ul. MenuBarVertical a.MenuBarSubmenuVisible
    {
    background-color: #d5647c;
    color: #FFF;
    }

    /*******************************************************************************

    Submenu INDICATION: styles if there is a submenu in a given category

    *******************************************************************************/

    / * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.
    UL. MenuBarVertical a.MenuBarItemSubmenu
    {
    background-image: url (SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 50 95%;
    }

    / * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" 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: 50 95%;
    }

    /*******************************************************************************

    BROWSER HACKS: hacks below should not be changed, unless you are an expert

    *******************************************************************************/

    / * HACK FOR IE: to ensure that sub menus show above form controls, underpin us each submenu with an iframe * /.
    UL. MenuBarVertical iframe
    {
    position: absolute;
    z index: 1010;
    Filter:alpha(opacity:0.1);
    }
    / * HACK FOR IE: to stabilize the appearance of the menu items. the slash in the float is to keep IE 5.0 analysis * /.
    @media screen, projection
    {
    UL. MenuBarVertical li. MenuBarItemIE
    {
    display: inline;
    f\loat: left;
    Background: #FFF;
    }
    }

    I always keep my details open when "set files" because I work with the radio, most of the time. If something is not successfully to the server you will see first there.

    I'm glad that you have built it.

  • Is it possible to position a horizontal Spry menu bar exactly?

    You can position a horizontal Spry menu bar in a particular place? For example at the bottom of the header div? I can't find where this is set in CSS and my reference manuals note this.

    Put your spry menu in your header div is not a good idea.  When you set the header rules, the menu will be affected.  I gave you the code

    Highlight 'Insert menu spry here' and insert your spry menu.

    Put the code above after the closing of your head tag

    Make sure the css for the header and menu bar are the same width and postitioning.

    Gary

Maybe you are looking for