How to prevent navbar hiding/collapsing on clicking a particular menu-item which has a dropdown class?
<p>I am trying to prevent the navbar collapse on click the <code>About Us</code> section or <code>Projects</code> section in the following code. I have tried <code>event.stopPropagation()</code> on these two buttons, but when till the time the jQuery code executes, the navbar has already collapses and hides itself.</p>

<pre><code>&lt;li class="page-scroll"&gt;
   &lt;a href="#home"&gt;Home&lt;/a&gt;
&lt;/li&gt;
&lt;li class="dropdown"&gt;
   &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;About Us&lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
   &lt;ul class="dropdown-menu" role="menu"&gt;
      &lt;li&gt;&lt;a href="aboutus.html"&gt;Vision&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="team.html"&gt;Founding Team&lt;/a&gt;&lt;/li&gt;
      &lt;!--&lt;li&gt;&lt;a href="donors.html"&gt;Members&lt;/a&gt;&lt;/li&gt;--&gt;
   &lt;/ul&gt;
&lt;/li&gt;
&lt;li class="page-scroll"&gt;
   &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown"&gt;Projects&lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
   &lt;ul class="dropdown-menu" role="menu"&gt;
      &lt;li&gt;&lt;a href="sample-campaign - vidya.html"&gt;Vidya Vistar&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="sample-campaign - safai.html"&gt;Safai Abhyaan&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="sample-campaign - clothes.html"&gt;Clothes Donation&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="sample-campaign - food.html"&gt;Food Donation&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="sample-campaign - onetime.html"&gt;Ad Hoc&lt;/a&gt;&lt;/li&gt;
   &lt;/ul&gt;
&lt;/li&gt;
&lt;li class="page-scroll"&gt;
   &lt;a href="#events"&gt;Events&lt;/a&gt;
&lt;/li&gt;
&lt;li class="page-scroll"&gt;
   &lt;a href="#gallery"&gt;Gallery&lt;/a&gt;
&lt;/li&gt;
&lt;li class="page-scroll"&gt;
   &lt;a href="#join"&gt;Get Involved&lt;/a&gt;
&lt;/li&gt;
</code></pre>

<p>How to prevent this hiding of navbar (on screen size less than <code>992px</code>) on clicking the <code>Projects</code> or <code>About Us</code> buttons?</p>