2015-04-17 25 views
6

Ich versuche Leuchtkasten für die Galerie-Seite in der Arbeits site.I die Schritte genau befolgt zu implementieren, wie die Bootstrap Leuchtkasten Seite Demo http://www.jasonbutz.info/bootstrap-lightbox/#usage unter Beweis gestellt und auch Youtube Video https://www.youtube.com/watch?v=J-EZC46hOc8 Allerdings ist mein Leuchtkasten nicht funktioniert . Plz help me Mein Code ist wie folgt:Bootstrap Leuchtkasten zeigt Bild nicht

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script> 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css"> 
<link href="bootstrap-lightbox.css" rel="stylesheet"> 
<script src="bootstrap-lightbox.js"></script> 

Dies sind Dateien im Kopfteil enthalten. Der Code im Körperabschnitt ist als:

<div class="row"> 
    <div class="container"> 

     <div id="demoLightbox" class="lightbox hide fade" tabindex="-1" role="dialog" aria-hidden="true"> 
     <div class='lightbox-content'> 
       <img src="img-3.png"> 
        <div class="lightbox-caption"><p>Your caption here</p></div> 
     </div> 
     </div> 
     <div class="col-lg-3"> 
     <a data-toggle="lightbox" href="#demoLightbox" class="thumbnail">Open Lightbox 
       <img src="img-3.png"> 
     </a> 
     </div> 


    </div> 
</div> 

ich Fehler wie: Uncaught Typeerror: this.hideWithTransition keine Hilfefunktion Plz ist, wo mit dem Code falsch ist.

+0

Sie eine Lösung bisher gefunden? –

Antwort

0

Versuchen von Klasse "verstecken" zu entfernen:

<div id="demoLightbox" class="lightbox hide fade" tabindex="-1" role="dialog" aria-hidden="true"> 

es funktioniert für mich.

+0

Das Plugin wird nicht mehr gepflegt. Funktioniert nicht mit Bootstrap 3 - selbst wenn Sie die Versteckklasse neu definieren, wie im Repo selbst vorgeschlagen. – dwilbank

0

Problem behoben überprüfen meinen Code CODEPEN

<a data-toggle="lightbox" href="#demoLightbox" ><img class="thumbnail" src="http://www.jasonbutz.info/bootstrap-lightbox/assets/img/small.png"></a>  
<div id="demoLightbox" class="lightbox fade" tabindex="-1" role="dialog" aria-hidden="true"> 

     <div class='lightbox-content'> 
       <img src="http://www.jasonbutz.info/bootstrap-lightbox/assets/img/large.png" alt="" /> 

      <div class="lightbox-caption"><p>Your caption here</p></div> 
     </div> 
    </div> 
    </div>