Results 1 to 10 of 10

Thread: drop down menu question

  1. #1
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default drop down menu question

    okay, so we are re-designing again and this time around we are going to utilize the dynamic drive scripts for our menus.

    Issue/Question:
    We are going to have 2 drop downs in the header (vertical) and I say 'two' because they will have different styling. I can see by the example page that this is doable. However, what I am concerned about is the third menu which will be a fly-out menu from the sidebar (horizontal). Can we use the DD Mega Menu script to achieve all (3) menus, or do I need an additional script for the sidebar?
    Last edited by claytonbrown; 06-18-2013 at 01:15 PM.

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,946
    Thanks
    16
    Thanked 304 Times in 303 Posts
    Blog Entries
    11

    Default

    It looks like the Mega Menu (don't forget the link when you ask about a DD script: http://www.dynamicdrive.com/dynamici...ddmegamenu.htm ) only supports drop-down levels so how about using a script that supports both vertical and horizontal? This should make things easier and eliminate the need for 2 scripts: http://www.dynamicdrive.com/dynamici...menu/index.htm
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. The Following User Says Thank You to Beverleyh For This Useful Post:

    claytonbrown (06-18-2013)

  4. #3
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default

    Quote Originally Posted by Beverleyh View Post
    It looks like the Mega Menu (don't forget the link when you ask about a DD script: http://www.dynamicdrive.com/dynamici...ddmegamenu.htm ) only supports drop-down levels so how about using a script that supports both vertical and horizontal? This should make things easier and eliminate the need for 2 scripts: http://www.dynamicdrive.com/dynamici...menu/index.htm
    Thanks!

    Although this is not the mega menu script, I imagine it will allow me to put anything inside the drop down/slide outs? Such as multiple columns, images & buttons.. And allow me to tell it which direction I want the overlap to go?
    Last edited by claytonbrown; 06-18-2013 at 03:06 PM.

  5. #4
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,946
    Thanks
    16
    Thanked 304 Times in 303 Posts
    Blog Entries
    11

    Default

    The format for the All Levels Menu is a series of unordered-lists so presumably you could add custom styles to individual list items and style them up with images, different heights, wrapped text, colours, etc. I haven't tried personally - I use the menu for auto-generated menus in a CMS, so the buttons work best when they're uniform and predictable - but if you're willing to play around with the CSS, I guess anything is possible.
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  6. The Following User Says Thank You to Beverleyh For This Useful Post:

    claytonbrown (06-18-2013)

  7. #5
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default hmmm

    okay, although I do know a good bit about CSS, I am thinking this would be easier if I just used the Mega menu for the top nav, and this script for my side column, this is, unless there is another 'mega-menu' like script that has a horizontal flyout? Or if the two scripts will conflict..?

    Thank you soooo much for your help!

  8. #6
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default

    New Issue:

    I now have the two scripts functioning on the same page (http://www.dynamicdrive.com/dynamici...menu/index.htm & http://www.dynamicdrive.com/dynamici...ddmegamenu.htm) and am almost home free into the world of CSS. however, I may have been naive in original design, which called for a sidebar that would be sticky upon scrolling down the site, which would also have a functioning slide out menu. The slide out menu works, until you scroll down and the div sticks to the top. At that point the menu fails to slide. I suppose I did not foresee this issue coming as I really need 3 scripts to function on the same page, the two menu sliders and the sticky script...

    View the issue live at http://www.shawntrautman.com/?theme=124 (remember, it is only in script testing phase of design now)
    Any thoughts here would greatly appreciated.
    Last edited by claytonbrown; 06-19-2013 at 02:25 AM.

  9. #7
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,946
    Thanks
    16
    Thanked 304 Times in 303 Posts
    Blog Entries
    11

    Default

    This might be the reason - from the All Level Menu demo/instructions page;
    Important Note: The HTML for the drop down menus themselves which are hidden by default via CSS, should be added to the <BODY> of your page outside any other element. A good spot would be the bottom of the page, right above the </BODY> tag.
    Yours are currently contained within your template. Move them out of your template to just above the </body> tag and see if that helps.
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  10. #8
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default back again

    back again... we aborted the sticky nav but now have new issue:

    When I take the JS out of the page and into the head section of the site the drop down stops functioning... not sure what to do here- We cannot have JS inside the body tags as it causes a warning for some browsers once a customer enters the secure side of the site (cart) -

    JS in question: (FYI, I cannot take the either piece out (nor both) to put into the head section as it will cause the drop down to not function)

    Code:
    <script src="ddmegamenu.js">
    
    /***********************************************
    * DD Mega Menu (c) Dynamic Drive (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for this script and 100s more.
    ***********************************************/
    
    </script>
    
    <script>
    
    ddmegamenu.docinit({
    	menuid:'solidmenu',
    	dur:200 //<--no comma after last setting
    })
    
    	
    ddmegamenu.docinit({
    	menuid:'megaanchorlink',
    	dur:500,
    	easing:'easeInOutCirc' //<--no comma after last setting
    })
    
    </script>
    Last edited by Beverleyh; 06-19-2013 at 10:46 PM. Reason: Formatting

  11. #9
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,946
    Thanks
    16
    Thanked 304 Times in 303 Posts
    Blog Entries
    11

    Default

    I'm on iPhone at the moment but a contributing factor to your problems might be that you're linking to a few jQuery libraries (1.6.1, 1.3.2 and 1.5.2). You only need one, so try taking out 1.3.2 and 1.5.2 and see how that goes.

    This could also be the reason why some scripts stop functioning when you move them to the head section - for example, if you're moving script calls up but placing them between the multiple jQuery library links, they'll stop working. You need one jQuery library at the top and all jQuery plugins and/or jQuery script calls below.

    Also, you might need to put jQuery into noConflict() mode: http://api.jquery.com/jQuery.noConflict/
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  12. #10
    Join Date
    May 2013
    Posts
    15
    Thanks
    11
    Thanked 1 Time in 1 Post

    Default

    Quote Originally Posted by Beverleyh View Post
    I'm on iPhone at the moment but a contributing factor to your problems might be that you're linking to a few jQuery libraries (1.6.1, 1.3.2 and 1.5.2). You only need one, so try taking out 1.3.2 and 1.5.2 and see how that goes.

    This could also be the reason why some scripts stop functioning when you move them to the head section - for example, if you're moving script calls up but placing them between the multiple jQuery library links, they'll stop working. You need one jQuery library at the top and all jQuery plugins and/or jQuery script calls below.

    Also, you might need to put jQuery into noConflict() mode: http://api.jquery.com/jQuery.noConflict/
    You nailed it! I took out the two older jQuery links and moved the code to the head & all is working flawlessly-

    I know we have 3 scripts running in the 'shell' of the site, and a few others on certain pages, so I will certainly look into implementing the no-conflict script soon. Thank you sooooo much!

Similar Threads

  1. drop down menu question
    By vjboc in forum Dynamic Drive scripts help
    Replies: 10
    Last Post: 06-11-2011, 04:53 AM
  2. Drop Down Menu CSS Question.
    By daebat in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 10-12-2009, 05:56 PM
  3. Drop down menu question
    By equalie in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 05-08-2008, 01:16 AM
  4. drop down menu question
    By mayde in forum JavaScript
    Replies: 0
    Last Post: 05-17-2006, 06:17 PM
  5. Drop Down Menu Question
    By hey_hon in forum JavaScript
    Replies: 0
    Last Post: 10-18-2005, 06:41 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •