Wie kann ich verhindern, dass das Menü ausgeblendet wird, wenn irgendwo auf der Seite auf dem Tablet geklopft wird?

Question

Ich verwende ein Bootstrap-Menü. Es ist sichtbar beim Schweben. Ich habe es auf Tablet möglich gemacht, um auf den Hahn zu öffnen. Jetzt ist das Menü zu lang für den Bildschirm, Sie müssen also nach unten scrollen, um die anderen Menüpunkte zu sehen. Aber wenn man die Seite tippen, um nach unten scrollen, das Menü verschwindet ...

Etwas Ähnliches geschieht auf Tablet:

Wie nur das Fell vom Fass auf dem Tablet deaktivieren?

Sie können es sehen auf: http://lumenis.bondtest.nl/test-inner-menu

Vielen Dank im Voraus!

Edit 1: Teilen Sie einig Code

<nav class="navbar navbar-default lumenisInnerMenu" role="navigation"> 
    <div class="container-fluid"> 
     <div class="navbar-header"> 
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse" aria-expanded="false"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       </button> 
     </div> 
     <div class="collapse navbar-collapse lumenisListItems"> 
      <ul class="nav navbar-nav"> 
       [*>NODE] 
      </ul> 
     </div> 
    </div> 
</nav> 

[>NODE] 
    <li class="[?SELECTED]dir current[/?][?NODE] dropdown-submenu HasChildren child[=DEPTH] dropdownmenu [/?]"> 
    [?ENABLED] 
     <a class="[?NODE] dropdown-toggle[/?]" data-url=[=URL] [?!NODE] href="[=URL]" [/?] [?NODE] data-toggle="dropdown" [/?]> 
       <div class="textsubitem"> 
        <span>[=TEXT]</span> 
       </div> 
     </a> 
    [?ELSE] 
     <a href="#" [?NODE] [/?]> [?NODE] 
      <span>[=TEXT]</span>[/?] 
     </a> 
    [/?] 
    [?NODE] 
     <ul class="dropdown-menu dropdown[=DEPTH]" id="[=ID]"> 
      [*>NODE] 
     </ul> 
    [/?] 
    </li> 
[/>] 

I DDRmenu auf DNN verwenden.

Answer 1

Sie können es mit Bootstrap tun einfach als erledigt „Über uns“ Menü

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<!-- Optional theme --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
 

 
<!-- Latest compiled and minified JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
<ul class="nav navbar-nav nav_menu"> 
 
        <li><a href="/">Home</a></li> 
 
        <li class="dropdown"> 
 

 
         <!-- Split button --> 
 
         <div class="btn-group actv"> 
 
          <a id="aboutUsDes" href="/about-us" class="actv">About Us</a> 
 
          <a href="" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false"> 
 
           <span class="caret"></span> 
 
           <span class="sr-only"></span> 
 
          </a> 
 
          <ul class="dropdown-menu" role="menu"> 
 
           <li><a href="/about-us/board">Board</a></li> 
 
           <li><a href="/about-us/our-people">Our People</a></li> 
 
          </ul> 
 
         </div> 
 
       </ul>