Problem in Bezug auf reduzierbare Navbar in Bootstrap

Question

Ich benutze Bootstrap Navbar und ich habe eine reduzierbare Navbar. Aber ich stehe vor einem seltsamen Problem, wenn ich meine Website auf kleinen Geräten, z. B. Handy oder Tablet (eigentlich für welche Geräte ich brauche die kollabierbare Navbar) öffnen, öffnet es standardmäßig die Navbar. Dies sollte nicht passieren. Wenn ich auf die Navigationsschaltfläche (dreizeilige Schaltfläche) klicke, sollte nur die Navigationsleiste erweitert werden. Aber meine Navbar erweitert sich standardmäßig zuerst auf kleinen Geräten.

Hier ist mein Code:

<nav class="navbar navbar-default navbar-fixed-top"> 
<div class="container"> 
<div class="navbar-header"><%= image_tag("logo.png", alt: "industryPrime") %></div> 
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 

<div class="navbar-collapse collapse in" id="myNavbar"> 
<ul class="navigation pull-right"> 
<li class="dropdown"> 
    <div class="dropdown"> 
<button id="feature_button" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown" style="background-color: transparent; color: #51a3af; border: none; font-size:11px;">FEATURES 
<span class="caret"></span></button> 
<ul class="dropdown-menu"> 
    <li><a href="#" class="scroll-link" data-id="paperless_purchase_section">Paperless purchase</a></li> 
    <li><a href="#" class="scroll-link" data-id="efficient_stores_section">Efficient stores</a></li> 
    <li><a href="#" class="scroll-link" data-id="peace_of_mind_section">Peace of mind</a></li> 
</ul> 
</div> 
</li> 

     <li> 

     <%= link_to "Case Study", user_maan_case_study_path %> 
     </li> 

     <li class="req_demo"> 

     <%= link_to "Request Demo", user_request_demo_page_path , :onclick => "demo_clicked()" ,:onmouseover => "start_count()" , :onmouseout => "stop_count()" %> 
     </li> 



     <li id="Login button section"><%= link_to 'Login', {controller: 'sessions', action: 'new'} %></li> 



     <li><a href="#" class="scroll-link" data-id="contact">Contact Us</a></li> 
     <li><%= image_tag("contact_us.png") %>+91 98302-15353</li> 
    </ul> 
    </div> 
    </div> 
</div> 
</nav> 

Meine Website-Link ist http://www.industryprime.com

mir bitte helfen, es zu beheben.

Vielen Dank im Voraus !!!

Answer 1

Bitte entfernen Sie die Klasse in in <div class="navbar-collapse collapse in" id="myNavbar">. Hoffe es wird dir helfen.