SimpleLightBoxは実行されません

このリンクからSimpleLightBoxを実行することができません（空白のページに通常の画像として開く画像をクリックした後）http://dbrekalo.github.io/simpleLightbox/。しかし、私は問題があります。私はJSとCSSファイル（正しく私はソースコードで開くことができます）を追加しました。次に、コードでHTMLとJSを追加しました。SimpleLightBoxは実行されません

<div class="imageGallery1"> 
    <a href="images/5x5.jpg" title="Caption for gallery item 1" ><img style="width: 300px; height: 300px" src="images/5x5.jpg" alt="Gallery image 1"/></a> 
    <a href="images/BG-BR5.jpg" title="Caption for gallery item 2"><img style="width: 300px; height: 300px" src="images/BG-BR5.jpg" alt="Gallery image 2" /></a> 
    <a href="images/BG-BR6.jpg" title="Caption for gallery item 3"><img style="width: 300px; height: 300px"src="images/BG-BR6.jpg" alt="Gallery image 3" /></a>  
</div> 
<script>$('.imageGallery1 a').simpleLightbox();</script>

画像が正しく挿入されていると私はここブートストラップ4を使用して、私はhttps://vitas.sk/1/に取り組んでいますテンプレート（スクロールダウン）とリンクされていますので、私はあまりにもjqueryの持っています。 jQueryライブラリがで呼ばれながら

出典

2017-12-31 Juraj Jakubov

jqueryとブートストラップスクリプトの後ろにlighboxスクリプトを配置してください –

私はあなたのテンプレートページをチェックすると、私はコンソールに

"ReferenceError: jQuery is not defined".

を誤りに気づいたがそれから私は、あなたのコードを調査し、あなたが<head>でSimpleLightBoxプラグインを呼び出していることに気づきましたページの末尾（</body>タグの直前）。

jQueryライブラリが初期化される前に、SimpleLightBoxプラグインが実行されています。

1）これは、jQueryのロードされた後、ライブラリが初期化されている修正されます：

はこの問題を解決するには、次の行います。 </body>タグの前に次の行を挿入します。

<script src="js/simpleLightbox.js" ></script>

2）これにより、simpleLightBoxプラグインの読み込み後に実行されるメソッドが修正されます。私は、ページ全体とそのスクリプトをロードして行われたとき、コードが実行されますことを確認するために、コードの周りに$(document).ready();を追加した

$(document).ready(function() { 
    $('.imageGallery1 a').simpleLightbox(); 
});

：上記の行の後に（とレディ機能を追加します）、次のコードを移動し。

出典

2017-12-31 15:29:47

jqueryをドキュメントの頭に追加していますが（頭では）、両方のスクリプトを最後に持っていたいと思います。（あなたの解決策は機能していません） –

はい、bodyタグの最後の前にsimplelightboxスクリプトを追加するだけで、最初はうまくいきません。理由はわかりません。私はあなたが言っていることは、ウェブサイトhttps://vitas.sk/1/を見ていましたが、うまくいきませんでした。 –

現在起こっていること：$（ '。imageGallery1 a'）。simpleLightbox（）;プラグインがロードされる前にexecturedを取得しています...私は答えによって更新されます： –

SimpleLightBoxは実行されません

答えて

関連する問題