Menu navigation drop-down Menu

I am new to Dreamweaver CS6 and as I go along in the design of a learning site. Here is the link to see the navigation menu, with the list in the menu which runs through in columns and rows and a black line that appears when the mouse passes over a menu drop-down. I tried to create the same look but couldn't and am stuck. Spry has been used and how to create the list in columns and rows in the menu drop-down? Or was this done using a jQuery template (what jQuery sites)? Your help would be greatly appreciated.

http://www.perennialsfabrics.com/

This isn't a Spry menu.  It's a mega Menu reagent system that seems to be part of a framework of Bootstrap.

In all cases, you can not do with Spry.  Also Spry is now obsolete as Adobe he abandoned last year.

Try this:

http://www.designchemical.com/lab/jQuery-mega-drop-down-menu-plugin/examples/

Download link:

http://www.designchemical.com/lab/jQuery-mega-drop-down-menu-plugin/download/

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Navigation drop-down menu showing only not on mobile

    I am currently doing my first website, when I try to preview my site on a mobile device, the drop down section of the menu navigation is not displayed correctly, he seems to be behind the carousel. Help please

    Try this;

    Unite the components

  • Navigation - drop down menus

    I have a vertical navigation bar on the right side of my home page. The submenus are right instead of below the main menu item. On smaller screens, this puts the buttons off the screen. Is there not a way to move the drop menu drop down so it goes down below the main menu item?

    Sub menus of a vertical navigation menu will only display on the right side, unfortunately you can not change this setting.

  • Mobile navigation - drop-down menu that closes after click and scroll to anchor? Am I the only one looking for this feature?

    Well, the question is a bit in the subject:

    But the problem is that I have a Compostion Widget with a menu inside. On my phone a tab in the menu opens - click on a menu item scrolls to the anchor - but the menu keep an open - I want it closes! So if you need to go to a new anchot - you open the new menu etc.

    How do I do that?

    BR,

    Mike

    Hi Mike,.

    Please make sure you have selected options as follows in the drop of the composition:

    Kind regards

    Akshay

  • Drop-down menu does not when the navigation bar collapses for mobile devices

    My menu drop-down does not work correctly when the navigation bar collapses on mobile devices. The menu, but it's completely to the left, not right where I like it and hidden under a picture so that none of the links are accessible. The site is http://www.medicinedancecounseling.com.

    Index-Z = stacking order.  So even if you make menu items at the top, they mask your portrait in a most flattering way.

    Nancy O.

  • Drop-down menu does not when the navigation bar collapses in rocker

    Hi all

    I use 3 "bootstrap" on the site below and I have some questions when the navigation bar collapses in rocking, as it seems to stop the drop down menus to work. When you tap or click the drop-down menus, the menu closes just, once again.

    Can someone tell me please on this?

    http://www.clockdoctors.co.UK/test/index.html

    I apologize to this topic. I didn't see that earlier post, I obviously had a blond moment.

    OK, so I think that I fixed it!

    I first tried to remove the script ' ' to see what would happen. Which translates to the stop of the page class 'scrolling' to work, but then allows the drop-down menu to work as it should, as you say.

    I then put this script, but removed this piece of code in the file "agency.js".

    Close the sensitive Menu on the Menu, click on item

    $('.navbar-effondrement_ul_li_a').click (function () {}

    $('.navbar-toggle:visible').click ();

    });

    and now it works fine!

  • Drop-down menu not covering not of side Navigation Menu

    Hello

    I have a page with a top navigation bar that includes menus and a side navigation bar.  The problem I have is that the drop-down menus aren't covering on the side menu, but seem to be merging with it on the same level.

    If you look at my page:

    http://mymajesticwindow.com/testing/dhHighlights

    Access the PRODUCTS and you can see what is happening.  Any ideas as to why this happens?  Not sure if this is a problem CSS or HTML, that's why I have included both below.

    <! doctype html >

    < html >

    < head >

    < meta charset = "utf-8" >

    < title > Majestic Windows < /title >

    < link href = "css/majesticStyles.css" rel = "stylesheet" type = "text/css" > "

    < link href = "css/topNav.css" rel = "stylesheet" type = "text/css" > "

    < link href = "css/sideNav.css" rel = "stylesheet" type = "text/css" > "

    < link rel = "shortcut icon" href = "favicon.png" / > "

    < / head >

    < body >

    <? PHP include("includes/header.php");? >

    <? PHP include("includes/topNav.php");? >

    < div id = "content" >

    <? PHP include("includes/sidebarDH.php");? >

    < div id = "contentRight" >

    < div id = "bodyCopy" >

    Majestic Signature Series < h1 > < br >

    Windows in vinyl & amp; Doors < / h1 >

    < h5 > < / h5 >

    < h2 > designed to express the way you live your life, from the majestic windows can help you create a home that is as unique as you are. There are several reasons to replace your old windows with vinyl ones and majestic windows make it easy. < / h2 >

    < h5 > < / h5 >

    < h2 > our Vinyl Windows are strong, durable, efficient energy and all are designed to performance, the beauty and reliability.

    < h5 > < / h5 >

    < / h2 >

    < h2 > choose from a variety of sizes and styles, including hung, (beating) crank, awning, Bay, BOW and Bay Windows. < / h2 >

    < / div > <! - bodyCopy - >

    < div id = 'beautyShot' >

    "< img src="images/index/indexBeauty.jpg "width ="380"height ="373"alt ="Beauty Shot">

    < / div > <! - beautyShot - >

    < / div > <! - contentRight - >

    < div id = "indexBodyBottom" >

    < div id = "dealerButton" >

    < a href = 'dealer' > < / a >

    < / div > <! - dealerButton - >

    < div id = "litDownloadText" >

    < strong > < a href = "literature" > download majestic < /a > < / strong > < / div > <! - litDownloadText - >

    < div id = "litImage" > < a href = 'literature' > < / a >

    < / div > <! - litImage - >

    < / div > <! - indexBodyBottom - >

    < / div > <! - content - >

    <? PHP include("includes/footer.php");? >

    < / body >

    < / html >

    CSS visibility:

    / * menu bar main * /.

    UL, #menu {}

    margin: 0;

    padding: 0;

    }

    / * submenu2 not appear at the first level of the mouse * /.

    #menu li: hover ul ul {}

    display: none;

    }

    / * main * /.

    UL, #menu li {}

    list-style-type: none; / * no bullets * /.

    float: left; / * horizontal guard * /.

    position: relative; / * Watch online * /.

    }

    / * Links main menu not over * /.

    UL, #menu li a {}

    color: #FFFFFF;

    display: block;

    do-family: Arial, Helvetica, without serif.

    do-size: 14px;

    line-height: 28px;

    padding: 5px;

    text-align: center;

    text-decoration: none;

    }

    / individual components of submenu * /.

    UL UL.sub-menu, #menu li {}

    background-color: rgba (52, 85, 56, 0.9);

    border-top: 1px solid #FFFFFF;

    list-style-type: none;

    float: none; / * keep even the blocks * /.

    }

    / * set submenu * /.

    UL, #menu li ul.sub-menu {}

    display: none;

    left:-20px;

    position: absolute; / * prevents toward the low content of menu - will it * /.

    top: 38px;

    Width: 165px;

    }

    / * submenu links was not hovering * /.

    UL, #menu li ul.sub-menu li a {}

    line-height: 19px;

    padding: 10px;

    }

    / * Displays the submenu hover * /.

    UL, li: hover {} ul.sub-menu #menu

    display: block;

    }

    / * links * /.

    UL, #menu li a: hover {}

    color: #CCCCB4;

    -webkit-transition: color 200ms facilitated;

    -moz-transition: color 200ms facilitated;

    -ms-transition: color 200ms facilitated;

    -o - transition: color 200ms facilitated;

    transition: color 200ms facilitated;

    }

    / * all submenu2 block * /.

    UL UL.sub-menu, #menu li ul.sub - menu2 {}

    left: 126px;

    position: absolute;

    text-align: center;

    top: 0;

    Width: 165px;

    }

    / * poster submenu2 hover * /.

    UL, #menu ul.sub-menu li: hover ul.sub - menu2 {}

    display: block;

    }

    sideNav CSS:


    {#sidebarGrad}

    Width: 245px;

    height: 497px;

    Background: rgb (134, 100, 63);

    background:-moz - gradient linear (270deg, rgb (134, 100, 63) 30%, rgb (184, 159, 125) 100%);

    background:-webkit - gradient linear (270deg, rgb (134, 100, 63) 30%, rgb (184, 159, 125) 100%);

    background:-o - gradient linear (270deg, rgb (134, 100, 63) 30%, rgb (184, 159, 125) 100%);

    background:-ms - gradient linear (270deg, rgb (134, 100, 63) 30%, rgb (184, 159, 125) 100%);

    background:-gradient linear (0deg, rgb (134, 100, 63) 30%, rgb (184, 159, 125) 100%);

    }

    UL #menuSide {}

    padding-top: 43px;

    padding-left: 0;

    right margin: 32px;

    margin left: 32px;

    margin-top: 0;

    list-style: none;

    position: relative;

    }

    UL li {} #menuSide

    do-family: Arial, Helvetica, without serif.

    font size: 15px;

    color: #F5F5EC;

    height: 37px;

    line-height: 37px;

    text-align: right;

    }

    #menuSide li UL a {}

    do-family: Arial, Helvetica, without serif.

    font size: 15px;

    color: #F5F5EC;

    display: block;

    padding-right: 20px;

    border-bottom-width: 1px;

    border-bottom-style: solid;

    border-bottom-color: #F5F5EC;

    }

    UL #menuSide li a: hover {}

    color: #A21029;

    border-bottom-color: #A21029;

    text-decoration: none;

    -webkit-transition: color 300ms facilitated;

    -moz-transition: color 300ms facilitated;

    -ms-transition: color 300ms facilitated;

    -o - transition: color 300ms facilitated;

    transition: color 300ms facilitated;

    }

    I found my own answer to this one.  I did some more research and added the z-index: 9999; ul, #menu li ul.sub-menu to the property.  Worked perfectly!

  • Horizontal navigation with Menu drop-down

    Hello!

    I'm trying to put together a site with a horizontal navigation with elements in the drop-down list. I built my plan with the main pages and child pages and added my horizontal navigation on the master page, but when I go to preview, I can't see any of my pages from the drop-down list (child). Is it possible to fix this? (I have attached a screenshot, I hope this helps clarify...)Adobe-Muse-Horizontal-Menu.jpg

    I knew that this problem will return that's why I mentioned the note that "child pages at the same level in the Plan view are listed vertically in a Horizontal Menu."

    If you have a look at the Plan view of your Site, you will have child pages under the other which translates a horizontal navigation as you found it.

    You must have all the pages of the child at the same level, while they are placed vertically (as you like) in the Menu.

    You can drag and drop the child pages in outline view to move them to the same level.

    I hope this helps.

    Kind regards

    Sachin

  • Drop down menu on the navigation bar?

    I got the basic navigation bar down pretty good where I understand and it. Now for the next step that I can't get is to add a drop-down list to appear when I go over it. Can a certain postal code to try and some explanation as the principles behind it for me to try to learn the lessons.

    Thank you

    Allen D. Macfalda

    You're not giving us much to go.  There are at least a dozen different ways to make interactive menus.

    In here is a that uses CSS:

    http://ALT-Web.com/demos/CSS2-Horiz-drop-menu.shtml

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

  • Dynamically fill a menu navigation menu drop-down

    I have some beautiful CSS to develop a horizontal drop down menu navigation similar to what is used on this site. But I can't understand how dynamically populate the menu and submenu items.

    The parents and children are stored in a single table with this structure:

    TopNavId
    TopNavParentId (for all parents, is 0 for all children, it is TopNavId for the parent)
    TopNavName
    TopNavOrder
    TopNavURL
    TopNavStatus

    I should be able to write a query to get the information in the table and then somehow loop on this query to get the pieces (parents and children) in the menu structure, just? I can't understand how to do this.

    Help? Thank you!

    -------------


    Thank you, Michael. The scooter5791 of recommended Sothink products is actually quite easy. Request of the mother works as a

    SELECT *.
    TRACKING
    WHERE topNavParentId = 0
    AND TopNavStatus = 1
    ORDER BY topNavOrder

    Request of the child is simply

    SELECT *.
    TRACKING
    WHERE topNavParentId <> 0
    AND topNavStatus = 1
    AND #getTopNav.topNavId #= topNavParentId

    and then just exit it traverses the query GetTopNavDropdown, essentially:


    ' #topNavName # ' #topNavURL #.

    The Sothink product made all the formatting, etc.

    Thank you, everyone, for help. -Dbast

  • addresses of Firefox in the navigation bar are missing/replaced by different menu drop down

    When I type in an address, the drop down menu no longer contains the same list of addresses as always. Instead, there is a list of locations (less actual addresses www.com beneath each) in bold and some places are repeated in the menu drop down but take me to a different site. Its a game guessing where Im going when I click on one. Next to each entry, there is a magnifying glass icon which was not there before. I was search playback for almost 3 hours trying to trouble shoot the issue and Ive tried to restore default with no luck. It's really annoying me... Any suggestions?

    It can happen because your some bars of tools and malware too...

    Hello

    The reset Firefox feature can solve a lot of problems in restaurant Firefox to its factory default condition while saving your vital information.
    Note: This will make you lose all the Extensions, open Web sites and preferences.

    To reset Firefox, perform the following steps:

    1. Go to Firefox > help > troubleshooting information.
    2. Click on the button 'Reset Firefox'.
    3. Firefox will close and reset. After Firefox is finished, it will display a window with the imported information. Click Finish.
    4. Firefox opens with all the default settings applied.

    Information can be found in the article Firefox Refresh - reset the settings and Add-ons .

    This solve your problems? Please report to us!

    Thank you.

  • Do not show in the drop-down menu bookmarks

    I want my bookmarks to display in the drop-down list only in the sidebar that I don't want to use

    Is that the drop-down menu that shows if you click view your bookmarks' button next to the button star bookmarks in the Navigation toolbar?

    Note that when you to bookmark a page by clicking on the star, then the new bookmarks is created in the unsorted folder.
    The unsorted folder does not show in the drop-down list.
    You can click on the underlined blue stars another moment to change the bookmark and move it to another folder.

  • Drop-down menu bookmarks gone?

    I have recently and reluctantly, had to start Win8 after getting a new laptop for school. I noticed that the new version of firefox has become the bookmarks icon a gimbal-side boring window similar to the historic way of navigation works. Is it possible to return to the menu drop-down? the new format drives me crazy. I just want 2 - click on my way to the pages. and without using the toolbar and take all my screen space. It took me a while to realize that I'm forced to use the icon star to add a bookmark. And even then it just auto-sortes it in Favorites unordered (oh the irony).

    There are two buttons appearing similar bookmark for toolbars; He who opens the bookmarks bar and one which opens the bookmarks Menu. Looks like you have the button of the sidebar, and not the Menu button.

    https://support.Mozilla.org/en-us/KB/customize-Firefox-controls-buttons-and-toolbars

  • The drop down menu boxes that appear under the heading of Firefox do not fill. A form of box on the screen, but it is empty. Given zero no has not solved the problem.

    The file, editing, display and help tabs that were on the previous version of FireFox Menu bar top are apparently incorporated into the "FireFox" drop-down box in the latest version of the browser. I was unable to open those tabs earlier, so by the recommendation of the Support Forum, I have Firefox on my laptop. Now not only the tabs above are missing after this reset, but the drop down menu does not open in any submenus. What I see now is a box on the surrounded black screen, but sub menu selections such as save as, print, copy etc are not shown in the box. This is why the Navigator is not functional in its current state.
    Does anyone have a fix for this problem that will not delete my favorites and other content stored on Firefox? Please save me to return to Internet Explorer.
    AJJC

    Try disabling hardware acceleration in Firefox.

  • where is Tools drop-down menu, it is not in my Firefox menu

    I'm following the instructions to assess plug-ins. The first step of click on 'tools', but it not there no tool anywhere on the toolbar or the firefox menu drop-down

    With the orange button in Firefox, addons is directly on the menu "run out" of two columns.

    To display the classic menu bar, press the ALT key, or press F10.

    If you prefer to go back to the classic menu bar, you can right click on an empty area of the tab bar (or the navigation toolbar) and select menu bar from the pop-up window. Or press Alt + v, and use the old view menu.

Maybe you are looking for