Results 1 to 10 of 10

Thread: About All Levels Navigational Menu (v3.02)

  1. #1
    Join Date
    Feb 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default About All Levels Navigational Menu (v3.02)

    1) Script Title: All Levels Navigational Menu (v3.02)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/

    3) Describe Problem: See below.

    Hi Guys!

    Firstly, greetings! I'm deny, new member here, and new in CSS/HTML though. I need some guide or advice
    Just trying to play and learn with the "All Levels Navigational Menu (v3.02)", I did install in on my test project.
    Looks very good with it. But the problem is appear when I test the menu (sub level menu) by adding longer text. The text is out from the menu box horizontally.
    Please check my screenshot attached.

    Much appreciated your help!


    Click image for larger version. 

Name:	All-Levels-Navigational-Menu-(v3.02).jpg 
Views:	142 
Size:	41.5 KB 
ID:	4943
    Last edited by james438; 02-21-2013 at 03:47 AM. Reason: added 1 - 3 to follow dd script post format

  2. #2
    Join Date
    Feb 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Any help?

  3. #3
    Join Date
    Jan 2007
    Location
    Davenport, Iowa
    Posts
    1,703
    Thanks
    82
    Thanked 90 Times in 88 Posts

    Default

    I moved your thread here where you will probably get better help and reformatted it a little because you are asking for help with a dynamicdrive script.

    Please post a link to your site so that others can better help diagnose your problem.
    Last edited by james438; 02-21-2013 at 05:29 PM. Reason: typo
    To choose the lesser of two evils is still to choose evil. My personal site

  4. #4
    Join Date
    Feb 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Many thanks for your help james! I don't know much about the script, tried everything, editing with the CSS. No solution found so far.
    By the way, the site is not online now.
    Any other users had similar case?
    Quote Originally Posted by james438 View Post
    I moved your thread here where you will probably get better help and reformatted it a little because you are asking for help with a dynamicdrive script.

    Please post a link to your site so that others can better help diagnose your problem?

  5. #5
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    594
    Thanks
    43
    Thanked 28 Times in 28 Posts

    Default

    there is a width to the links and if you go beyond it that's what happens.

    You will need to expand the whole menu to make longer text links as you are showing in your post.

    Is that the idea? You want to do this? Long text links instead of the normal(standard limited size as the script uses)?

    Can you post what you have now for the page you are talking about?
    Thanks,

    Bud

  6. #6
    Join Date
    Feb 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi
    Thank you for your reply
    This is the HTML I've written
    Code:
    <nav id="navigation">
    						<ul class="ddsmoothmenu">
    							<li><a href="about.html">About us</a></li>  
    							<li>
    								<a href="#">Drop down</a>
    								<ul>
    									<li><a href="#">One level menu</a></li>
    									<li><a href="#">Very Long Top Level Menu with Very Long Text Very Long Top Level Menu with Very Long Text</a>
    										<ul>
    											<li><a href="#">Example level</a></li>
    											<li><a href="#">Example level</a></li>
    											<li><a href="#">Example level</a></li>
    										</ul>
    									</li>
    									<li><a href="#">Three level menu</a>
    										<ul>
    											<li><a href="#">Example level</a>
    											<ul>
    												<li><a href="#">Example level</a></li>
    												<li><a href="#">Example level</a></li>
    												<li><a href="#">Example level</a></li>
    											</ul>											
    											</li>										
    											<li><a href="#">Example level</a>
    											<ul>
    												<li><a href="#">Example level</a></li>
    												<li><a href="#">Example level</a></li>
    												<li><a href="#">Example level</a></li>
    											</ul>											
    											</li>
    										</ul>
    									</li>									
    								</ul>
    							</li>
    							<li><a href="index.html">Archive</a></li>
    							<li><a href="contact.html">Contact</a></li>
    						</ul>
    					</nav>
    and this is the CSS
    Code:
    .ddsmoothmenu ul{
    	z-index:999999;
    	margin: 0;
    	padding: 0;
    	list-style-type: none;
    }
    
    /*Top level list items*/
    .ddsmoothmenu ul li{
    	position: relative;
    	display: inline;
    	float: left;
    	padding:0;
    	margin:0;
    }
    
    /*Top level menu link items style*/
    .ddsmoothmenu ul li a{
    	color:#999999;
    	font-style:normal;
    	padding:0;
    	margin:10px 0 10px 0;
    	display: block;
    	text-decoration: none;
    	font-weight:normal;	
    }
    
    .ddsmoothmenu ul li a span{
    	text-transform:none;
    	font-style:italic;
    	font-size:11px;
    	font-weight:normal;
    }
    
    .ddsmoothmenu ul li.last{
    	border-right:none;
    }
    
     .ddsmoothmenu ul li.first{
     	border-left:none;
     }
     
    * html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
    	display: inline-block;
    }
    
    .ddsmoothmenu ul li a.selected, .ddsmoothmenu ul li a:hover, .ddsmoothmenu ul li a.active{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
    	color:#fff;
    }
    
    #navigation ul li ul li a:hover, #navigation ul li ul li a.selected, ul li ul li a.active{
    	color:#fff;
    }
    
    /*1st sub level menu*/
    .ddsmoothmenu ul li ul{
    	z-index:999999;
    	position: absolute;
    	left: 20px;
    	display: none; /*collapse all sub menus to begin with*/
    	visibility: hidden;
    	margin:0;
    	padding:0;
    	border:none;
    }
    
    /*Sub level menu list items (undo style from Top level List Items)*/
    .ddsmoothmenu ul li ul li{
    	display: list-item;
    	float: none;
    	margin:0;
    	padding:0;	
    	border:none;
    }
    
    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
    .ddsmoothmenu ul li ul li ul{
    	background:#1c1c1c;
    	border-top:1px solid #999999;
    	
    }
    
    #navigation .ddsmoothmenu ul{
    	border-top:1px solid #080808;
    	background:#1c1c1c;
    	margin:0;
    	padding:0;
    }
    
    #navigation .ddsmoothmenu ul ul{
    	background:#1c1c1c;	
    	border-top:1px solid #080808;
    	margin:0 0 0 0;
    	padding-top:0;
    }
    
    /* Sub level menu links style */
    .ddsmoothmenu ul li ul li a{
    	width: 160px; /*width of sub menus*/
    	margin: 0;
    	text-transform:none;
    	color:#999999;
    	border:none;
    	border-top:1px solid #363636;
    	border-bottom:1px solid #080808;
    	font-weight:normal;	
    	font-size:12px;
    	display: inline-block;
    	line-height:18px;
    }
    
    
    .ddsmoothmenu ul li ul li a:hover {
    	background:#1e1e1e;
    }
    #navigation .ddsmoothmenu ul li{
    	margin:0;
    	line-height:18px;
    	text-align:left;
    	display: inline-block;
    }
    
    #navigation .ddsmoothmenu ul li a{
    	padding:5px 20px 5px 20px;display:block;
    }
    Is that the idea? You want to do this? Long text links instead of the normal(standard limited size as the script uses)?
    Yes, exactly is it. I want to use longer text in the 2nd level menu (dropdown), and I hope when I use it, the text is will adjusted vertically and still inside the "width" that I gave background. Instead of horizontally our from that "width".

    Any thought?

    Thnak you;
    Deny

    Quote Originally Posted by ajfmrf View Post
    there is a width to the links and if you go beyond it that's what happens.

    You will need to expand the whole menu to make longer text links as you are showing in your post.

    Is that the idea? You want to do this? Long text links instead of the normal(standard limited size as the script uses)?

    Can you post what you have now for the page you are talking about?

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

    Default

    Sorry - the code you posted is incomplete and doesnt do much to help us.

    The demo wraps text as expected when it gets too long, so it must be down to something else in the rest of your code.

    The only thing I can think of is that you've set a text-wrap CSS property somewhere that is affecting the menu as well.

    If you need more help, please post a link to you page.
    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

  8. #8
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    594
    Thanks
    43
    Thanked 28 Times in 28 Posts

    Default

    That does not include the js script and any of the rest of the css files.

    Please post a complete (all) of the markup for your page.Everything and all of it please, as you have it on your page...
    Thanks,

    Bud

  9. #9
    Join Date
    Jan 2011
    Location
    Southeastern CT
    Posts
    594
    Thanks
    43
    Thanked 28 Times in 28 Posts

    Default

    I made a temp file and made a few items long like you are asking about and they worked fine within the menu.

    http://www.web-user.info/test/alllevels/demo.htm

    I only made a change in the with of the menu in the top menu css file,thats all I changed
    Thanks,

    Bud

  10. #10
    Join Date
    Feb 2013
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hii Bud!

    Many thanks for the help!
    I still on my efforts to figured it out.
    Will back to here soon (I hope so)

    Many thanks
    Deny
    Quote Originally Posted by ajfmrf View Post
    I made a temp file and made a few items long like you are asking about and they worked fine within the menu.

    http://www.web-user.info/test/alllevels/demo.htm

    I only made a change in the with of the menu in the top menu css file,thats all I changed

Similar Threads

  1. All Levels Navigational Menu help
    By twitch72 in forum Dynamic Drive scripts help
    Replies: 1
    Last Post: 04-24-2010, 09:37 AM
  2. All Levels Navigational Menu (v2.2)
    By Mrs Miggins in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 04-03-2010, 10:20 AM
  3. All Levels Navigational Menu (v2.2)
    By Shahar in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 07-21-2009, 03:33 PM
  4. Help with All Levels Navigational Menu
    By Yukoner in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 03-26-2009, 01:26 AM
  5. All Levels Navigational Menu (v1.5) IE6
    By Geula in forum Dynamic Drive scripts help
    Replies: 2
    Last Post: 10-24-2008, 07:47 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
  •