Results 1 to 8 of 8

Thread: Flex Sub-menu items not fit in the browser window?

  1. #1
    Join Date
    Oct 2010
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Flex Sub-menu items not fit in the browser window?

    Hi all,
    I am collecting the data from different tables and i prepare one dynamic menu...
    but the problem is not showing sub-categories properly.(I think this is presentation problem). It goes top in browser and not visible properly from starting onwords....
    See this page when mouseover on companies for better understand....
    http://rfcables.org/country_dropdown.php

    Give me some suggestions...

    This is the javascript:

    http://www.dynamicdrive.com/dynamici...exdropdown.htm
    Last edited by jscheuer1; 10-28-2010 at 01:53 PM. Reason: ad - "This is the javascript:"

  2. #2
    Join Date
    Aug 2004
    Posts
    9,911
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    The script will reposition any sub menu "bottoms up" when there isn't enough space downwards to fully show the sub menu. Since in your case there isn't enough space upwards either to show the sub menu, it appears clipped from the top window's edge.

    You can force the script to always display the sub menus downwards by finding the below line inside the .js file and commenting it out:
    Code:
    //y=(parentlioffset.top+$ul.data('dimensions').h > docbottomedge)? y-$ul.data('dimensions').h+$ul.data('dimensions').parentlih : y
    DD Admin

  3. #3
    Join Date
    Oct 2010
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you for your reply...

    After commenting that line, now it is showing nice...

    but is there any option to add button like windows file menu(means some other sub-items are there to visit) after 10 sub-items...

    Give me some guidance to add that into it... when there are more than 10 sub-items....

    Thanking you...

  4. #4
    Join Date
    Aug 2004
    Posts
    9,911
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    Another thing you can try is just to explicitly set the height of very long sub ULs so the items scroll (via a scrollbar). For example:

    Code:
    <ul id="flexmenu1" class="flexdropdownmenu">
    <li><a href="#">Item 1a</a></li>
    <li><a href="#">Item 2a</a></li>
    <li><a href="#">Item Folder 3a</a>
    	<ul style="height:300px;overflow:scroll">
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	<li><a href="#">Sub Item 3.1a</a></li>
    	<li><a href="#">Sub Item 3.2a</a></li>
    	<li><a href="#">Sub Item 3.3a</a></li>
    	<li><a href="#">Sub Item 3.4a</a></li>
    	</ul>
    </li>
    <li><a href="#">Item 4a</a></li>
    <li><a href="#">Item Folder 5a</a>
    	<ul>
    	<li><a href="#">Sub Item 5.1a</a></li>
    	<li><a href="#">Item Folder 5.2a</a>
    		<ul>
    		<li><a href="#">Sub Item 5.2.1a</a></li>
    		<li><a href="#">Sub Item 5.2.2a</a></li>
    		<li><a href="#">Sub Item 5.2.3a</a></li>
    		<li><a href="#">Sub Item 5.2.4a</a></li>
    		</ul>
    	</li>
    	</ul>
    </li>
    <li><a href="#">Item 6a</a></li>
    </ul>
    DD Admin

  5. #5
    Join Date
    Oct 2010
    Posts
    19
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thank you for reply...

    i used earlier this scroller, but the problem is when there is any sub-items in sub-menus... it is not comfortable to the end-user point of you and also scroller blocks the mouseover action...

    Thats why i asked to put some small arrow-down button with the addition of menus if there is more than 10 items....

  6. #6
    Join Date
    May 2007
    Posts
    20
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by ddadmin View Post
    The script will reposition any sub menu "bottoms up" when there isn't enough space downwards to fully show the sub menu. Since in your case there isn't enough space upwards either to show the sub menu, it appears clipped from the top window's edge.

    You can force the script to always display the sub menus downwards by finding the below line inside the .js file and commenting it out:
    Code:
    //y=(parentlioffset.top+$ul.data('dimensions').h > docbottomedge)? y-$ul.data('dimensions').h+$ul.data('dimensions').parentlih : y
    Hello

    I'm having the same problem.. but with the secondary drop down. Meaning, the menu from my parent works fine, but a submenu kicking out of my menu is positioning from the bottom up, and is clipped by the browser.

    I commented the line above, and it's still doing the same thing. My menus are vertical menus, and I just updated my flexdropdown code to the latest/greatest.

    Any suggestions?

    Thanks!
    hank

  7. #7
    Join Date
    Apr 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by ddadmin View Post
    The script will reposition any sub menu "bottoms up" when there isn't enough space downwards to fully show the sub menu. Since in your case there isn't enough space upwards either to show the sub menu, it appears clipped from the top window's edge.

    You can force the script to always display the sub menus downwards by finding the below line inside the .js file and commenting it out:
    Code:
    //y=(parentlioffset.top+$ul.data('dimensions').h > docbottomedge)? y-$ul.data('dimensions').h+$ul.data('dimensions').parentlih : y

    I am having the same problem. Can you give an example of how to "comment it out"

    Thank you

  8. #8
    Join Date
    Apr 2010
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up

    I'm so sorry, I didn't even notice the slashes. Everything was a blur last night from hours of reading code. My apologies!

    Btw, thanks for answering the previous posts. It work for me too!

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
  •