Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder Psionicsin's Avatar
    Join Date
    Aug 2010
    Location
    Detroit, Michigan
    Posts
    346
    Thanks
    54
    Thanked 0 Times in 0 Posts

    jQuery Combination Menu NOT working

    I can't figure out what I'm doing wrong with this menu.

    I'm trying to integrate this jQuery menu: http://javascript-array.com/scripts/...rop_down_menu/

    Into the jQuery menu that I already have established: http://rutholsonphoto.com/rop_testbuild/index.php

    ...but it's coming out disastrous, and I haven't a clue as to where my problem lies.

    The original menu that I was using made the names of the menu's flip backward to a darker text on a lighter colored background. The secondary one was supposed to add drop down functionality to 3 of those menu titles.

    Instead it's breaking the styling and forcing everything to be text and to the top-left of the page.

  • #2
    Regular Coder Psionicsin's Avatar
    Join Date
    Aug 2010
    Location
    Detroit, Michigan
    Posts
    346
    Thanks
    54
    Thanked 0 Times in 0 Posts
    Anyone at all, or did I leave out some information that you guys need?

  • #3
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,954
    Thanks
    9
    Thanked 724 Times in 718 Posts
    Looked at your linked page and I don't see what you describe - "At a glance" and "About us" etc flip over in the way you describe, but I don't see any broken styling.

    Or....is "About Ruth" and "About the staff" the dropdown? If so, then your html is wrong - you have:

    Code:
    <li>
       <a class="hovermenu" href="#" style="margin-top: -29px;">About Us</a>
       <a class="normalmenu" href="#">About Us</a>
    </li>
    <ul>
       <li><a href="#">About Ruth</a></li>
       <li><a href="#">About the Staff</a></li>
    </ul>
    which should be nested:

    Code:
    <li>
       <a class="hovermenu" href="#" style="margin-top: -29px;">About Us</a>
       <a class="normalmenu" href="#">About Us</a>
       <ul>
          <li><a href="#">About Ruth</a></li>
          <li><a href="#">About the Staff</a></li>
       </ul>
    </li>
    Try fixing that first.

  • #4
    Regular Coder Psionicsin's Avatar
    Join Date
    Aug 2010
    Location
    Detroit, Michigan
    Posts
    346
    Thanks
    54
    Thanked 0 Times in 0 Posts
    EDIT:

    I see what I was doing wrong. I didn't even realize that I had my ul's outside of their respective li's.

    But although that's solved, I'm still not getting drop-down functionality.
    Last edited by Psionicsin; 01-27-2011 at 02:49 AM.

  • #5
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,954
    Thanks
    9
    Thanked 724 Times in 718 Posts
    OK, there's a few things wrong.

    Try removing overflow:hidden from #header, and the height setting from #jsddm. With these the dropdowns will always be hidden. The dropdowns are then visible, but your design breaks.

    Take the top margin off #navcontainer, that fixes your design somewhat.

    Not sure what you want to happen with the top level, but probably not as it now appears...

  • #6
    Regular Coder Psionicsin's Avatar
    Join Date
    Aug 2010
    Location
    Detroit, Michigan
    Posts
    346
    Thanks
    54
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by SB65 View Post
    Try removing overflow:hidden from #header, and the height setting from #jsddm. With these the dropdowns will always be hidden. The dropdowns are then visible, but your design breaks.
    And this is what I can't have happen, but I'm not aware of a remedy to fix this as the flip menu wasn't developed by myself.

    Quote Originally Posted by SB65 View Post
    Not sure what you want to happen with the top level, but probably not as it now appears...
    The titles should flip backward (via the animation already seen), and a dropdown menu should appear also (IF it is tagged to for dropdown function).


  •  

    Posting Permissions

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