Monday, May 20, 2024
 Popular · Latest · Hot · Upcoming
56
rated 0 times [  57] [ 1]  / answers: 1 / hits: 64205  / 11 Years ago, tue, june 18, 2013, 12:00:00

I am having an issue with the Bootstrap menu dropdowns on mobile devices (Bootstrap 2). A similar question was asked here with dropdown buttons, however the answer for that was an inherent bug within bootstrap which was solved in an update. I appear to be having the same issue so perhaps it's down to my markup?



I have a collapsable navbar with dropdowns and everything works perfectly on desktop browsers. However on a mobile, the dropdowns will open up when you click on the dropdown but clicking any dropdown links will just fold the dropdown back up again — the links cannot be reached. I have tried various bootstrap versions and cannot correct this so I can only imagine it is my markup. Here it is:



 <header class=navbar>
<div class=navbar-inner>
<div class=container>
<a href=#><h1>Branding</h1></a>
<button type=button class=btn btn-navbar data-toggle=collapse data-target=.nav-collapse> Menu </button>
<div class=nav-collapse collapse>
<ul class=nav>
<li><a href=#>Menu Item 1</a></li>
<li class=dropdown>
<a href=# class=dropdown-toggle data-toggle=dropdown>Menu Item 2 (Dropdown)<b class=caret></b></a>
<ul class=dropdown-menu>
<li><a href=#>Dropdown Item 1</a></li>
<li><a href=#>Dropdown Item 2</a></li>
<li><a href=#>Dropdown Item 3</a></li>
<li><a href=#>Dropdown Item 4</a></li>
</ul>
</li>
<li><a href=#>Menu Item 3</a></li>
<li><a href=#>Menu Item 4</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</div>
</header>


Here's an example replicating the code (sorry, can't send the site): http://jsfiddle.net/yDjw8/1/



(Problem can only be seen/replicated on mobile — I'm using iOS)



Any help would be much appreciated.


More From » html

 Answers
42

In your minified bootstrap.min.js file, find the substring



ontouchstart


and replace it with



disable-ontouchstart


Check out this similiar SO question:
Bootstrap Collapsed Menu Links Not Working on Mobile Devices


[#77555] Monday, June 17, 2013, 11 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
parker

Total Points: 259
Total Questions: 109
Total Answers: 97

Location: Zambia
Member since Thu, Jun 25, 2020
4 Years ago
;