Databases
StackOverflow2013
Postsdbo
POjQuery accordion slides up multiple times
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery accordion slides up multiple times
    text
    copied!<p>I'm making a jquery accordion and I have some issues</p> <p>My jQuery searches for a ul inside a class and if it has a certain class it slides down, but it slides down as many times as the element ul exists in the whole nav</p> <p>Here is my jquery code so far:</p> <pre><code>if($(this).has("ul").length){ $(".menu ul li").on('click',function(e){ $(this).addClass('open').siblings().removeClass('open').children(); $('.menu ul li ul').slideUp(); if($(this).parents().find(".open").length){ $(this).children('ul').slideDown(); } //$(this).parents().find(".open").children('ul').slideDown(); e.preventDefault(); }); }; </code></pre> <p>this is my html:</p> <pre><code> &lt;div class="menu"&gt; &lt;a id="jump" href="#"&gt;&lt;p&gt;Menu&lt;/p&gt;&lt;span class="right"&gt;&amp;#9660;&lt;/span&gt;&lt;/a&gt; &lt;nav class="row"&gt; &lt;div class="page_wrapper"&gt; &lt;ul class="niveau_1"&gt; &lt;li class="active"&gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Group&lt;/a&gt; &lt;ul class="sub-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;QHSE/Awards&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Vacatures/&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Nieuws &amp;amp; Media&lt;/a&gt; &lt;ul class="sub-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Van Moer in de media&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Nieuwsarchief&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Sport &amp;amp; Events&lt;/a&gt; &lt;ul class="sub-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Casual Friday&lt;/a&gt; &lt;ul&gt; &lt;li&gt;&lt;a href="#"&gt;Inschrijving&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Foto's&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Thursday Lounge&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Triatlon&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Sponsoring&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Beurzen&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Kalender&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Vestigingen&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload