tags:

views:

33

answers:

1

I have a menu div which shows/hides based on click with jQuery, but none of the links are active when you put them in .. ideas?

I only have one item in the list that is a hyperlink. Once I can get it to work, I'll add it to the rest of the items .. however that one link doesn't work.

jQuery

  $(".sign_in").click(function() {
      $("#sign_box").toggle();     
      return false;
  });
  $("body #main").click(function() {
      $("#sign_box").hide();
      return false;
  });

CSS

#sign_box
    {
    -webkit-box-shadow: rgba(0, 0, 0, 0.296875) 0px 3px 3px;
    width:170px; 
    background-color:#FFF; 
    border: 5px solid #CCC; 
    padding:8px;
    position:absolute;
    display:none;
    z-index: 100;
    line-height: 16px;
    border-bottom-left-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
    border-top-left-radius: 5px 5px;
    border-top-top-radius: 5px 5px;
    color: #555;
    font-weight: bold;
    text-decoration: none;
    -moz-border-radius-topright:6px;
    -moz-border-radius-bottomleft:6px;
    -moz-border-radius-bottomright:6px;
    -webkit-border-top-right-radius:6px;
    -webkit-border-bottom-left-radius:6px;
    -webkit-border-bottom-right-radius:6px;
    }
    .sign_in
    {
    color: White;
    font-weight: bold;
    font-size: 16px;
    text-decoration: none;
    background-color:#53A1DC; 
    border-bottom-left-radius: 4px 4px;
    border-bottom-right-radius: 4px 4px;
    border-top-left-radius: 4px 4px;
    border-top-top-radius: 4px 4px;
    border:solid 1px #5ea0c1;
    padding:6px;
    }
    a.sign_in span 
    {
        background-image: url("../images/toggle_down_light.png");
        background-position: 100% 50%;
        background-repeat: no-repeat;
        padding-right: 18px;
    }

HTML

<div><a href="#" class="sign_in"><span>User Options</span></a></div>
<div id="sign_box">
<ul class="account-links">
    <li><a href="../raceday/events/list">All Events</a></li>
    <li>My Events</li>
    <li>My Profile</li>
    <li>All Clubs</li>
    <li>Change My Password</li>
    <li>My Dependants</li>
</ul>
</div>
A: 

Only one of the items is a link, the "All Events" entry. Add the anchor tag to the rest or associate a click event navigation via js to have them actually do something...

If you do have js code already wired up that makes the li items menus that go somewhere you should show us that code also...

Tahbaza
I realize the others aren't actually links - the one that is doesn't work so I didn't add the other ones...
Kevin