Dropdown Menu Toggle not working on iPhone
<p>I have the below menu + toggle button works great on any browsers on Android but iOS....</p>

<p>I can click on the button then the menu will show up &amp; hide right away after showing.</p>

<p>I used a lot of work-around &amp; fix, disable touchstart in bootstrap.js or changing z-index of navbar. . . but it won't help me anyway with this problem.</p>

<p>The menu seems to show up after click the toggle button but I can't see anything. I have to touch the toggle button again as closing the menu &amp; touch again to open the menu again.</p>

<p>You guy can have a check if you have iPhone at <a href="http://getheadsup.com/" rel="nofollow">http://getheadsup.com/</a></p>

<p>Thank you for your concern about my problem.</p>

<pre><code> &lt;div id="header-wrapper" class="header fadeIn"&gt;
    &lt;div class="navbar navbar-default navbar-fixed-top" role="navigation"&gt;
        &lt;div class="container-fluid row"&gt;
            &lt;div class="navbar-header"&gt;
                &lt;a class="navbar-brand" href="index.html#top"&gt;&lt;/a&gt;
            &lt;/div&gt;
            &lt;div class="navbar-footer"&gt;
                &lt;a href='order.php' class='navbar-preorder'&gt;PRE ORDER&lt;/a&gt;
                &lt;!-- hamburger icon --&gt;
                &lt;button type="button" class="navbar-toggle collapsed menu-btn"&gt;
                    &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                    &lt;span class="icon-bar top-bar"&gt;&lt;/span&gt;
                    &lt;!-- &lt;span class="icon-bar middle-bar"&gt;&lt;/span&gt;--&gt;
                    &lt;span class="icon-bar bottom-bar"&gt;&lt;/span&gt;
                &lt;/button&gt;
            &lt;/div&gt;
            &lt;div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"&gt;
                &lt;div class="collapse navbar-collapse main-menu"&gt;
                    &lt;ul class="nav navbar-nav"&gt;
                        &lt;li&gt;
                            &lt;a href="index.html#alexa"&gt;Alexa&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;
                            &lt;a href="index.html#technology"&gt;Technology&lt;/a&gt;&lt;/li&gt;
                        &lt;li id="spin"&gt;
                            &lt;a href="index.html#techspec"&gt;Tech Specs&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;
                            &lt;a href="index.html#faq"&gt;FAQ&lt;/a&gt;&lt;/li&gt;
                        &lt;li&gt;
                            &lt;a href="http://blog.getheadsup.com/"&gt;Blog&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>