ausblenden navbar (Bootstrap) auf photoswipe Bild

Question

klicken Wie man irgendwie in dem Bild sehen kann, ist meine navbar noch sichtbar, wenn ich in der Galerie-Ansicht von PhotoSwipe bin. Ich weiß wirklich nicht, wie das passiert ist.

<header> 
 
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
 
    <div class="container"> 
 

 
     <div class="navbar-header"> 
 
     <!-- FOR MOBILE VIEW COLLAPSED BUTTON --> 
 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse" aria-expanded="false" aria-controls="navbar"> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
      <span class="icon-bar"></span> 
 
     </button> 
 

 
     </div> 
 

 
     <!-- Header Menu Bar 
 
\t \t \t \t ================================================== --> 
 
     <div id="nav-main" class="navbar-collapse collapse"> 
 
     <ul id="top-menu" class="nav navbar-nav main-nav"> 
 
      <li> 
 
      <a class="activeNav" href="#home"> <span class="icon icon-home"></span> STARTSEITE</a> 
 
      </li> 
 
      <li> 
 
      <a href="#page-1"> <span class="icon icon-user"></span> ABOUT ME</a> 
 
      </li> 
 
      <!-- etc.. --> 
 
     </ul> 
 
     </div> 
 
     <!-- /.nav-collapse --> 
 
    </div> 
 
    <!-- /.container --> 
 
    </nav> 
 
    <!-- /.navbar --> 
 
</header>

Die Galerie/Photoswipe Initialisierung 1: 1 wie die Vorlage in der Dokumentation. Ich erinnere mich, dass es irgendwann funktionierte, während die Navigationsleiste fehlerhaft war.

Was ist der einfachste Weg, um die Navbar zu verbergen? Kann ich nicht irgendwie die Navbar auf PhotoSwipe umschalten und den Button wieder auf Leave schalten?

Answer 1

Dies wird in der Regel durch den Z-Index der Klasse .navbar-Fixed-Top verursacht einen höheren Wert als die photoswipe Hintergrundklasse .pswp, beste Sache zu tun ist, überprüfen Sie das Fotoelement in Ihrem Browser und entweder erhöhen Sie die z -Index für den Hintergrund Fotoswipe oder verringern Sie den Z-Index der Bootstrap-Navbar-Fixed-Top.

.pswp { 
    z-index: 2500; 
}