html - jQuery toggle problem: animates twice -


i have me mystic problem jquery "toggle" method. click once, animates twice. go see yourself!

demo

page source pasted below, (link disappear when have solved this).

html:

<ul class="topnav">      <li><a>about us</a></li>      <li><a href="javascript:void(0)" class="sublink">store</a></li>           <li class="subnav"><a href="javascript:void(0)">hours</a></li>          <li class="subnav"><a href="javascript:void(0)">products</a></li>       <li><a href="javascript:void(0)">@the moment!</a></li>      <li><a href="javascript:void(0)">contact</a></li>  </ul> 

css

a{     text-decoration: none;     color: black; } a:hover{     color: #cede43; } ul.topnav{     list-style: none;     margin: 0;     padding: 20px;     float: left;     font-family: 'arial', sans-serif;     font-weight: bold;                        font-size: 20px;           } ul.topnav li{                 float: left;     margin-right: 20px;     position: relative;                              } li.subnav{     display: none;           font-family: 'courier new', serif;     } 

code

 $(document).ready(function(){         $("a.sublink").click(function(){             $(this).parents().find("li.subnav").toggle('slow');         });             }); 

target 1 specific parent instead of several .parents().

$("a.sublink").unbind().click(function(){     $(this).parents("ul").find('.subnav').toggle(200); });  

i'm guessing it's issue version duplicate elements added set when .find() multiple ancestors.


Comments

Popular posts from this blog

apache - Add omitted ? to URLs -

redirect - bbPress Forum - rewrite to wwww.mysite prohibits login -

php - How can I stop spam on my custom forum/blog? -