• 締切済み

lightboxの設置

<html lang="ja"> <head> <link href="css/lightbox.css" rel="stylesheet" media="all" type="text/css" /> <script src="jquery-3.1.1.min.js" type="text/javascript"></script> <meta charset="UTF-8"> <title></title> </head> <body><a href="img/bb123.jpg" data-lightbox="group" data-title="S001"><img src="img/bb123.jpg" alt="" width="256" /></a> <script src="css/lightbox.js" type="text/javascript"></script> <script> lightbox.option({ 'fitImagesInViewport' : true, 'wrapAround': false }) </script> </body> </html> とりあえずテストで、lightbox2の設置をしようとしているのですが、 サイトに書いてあるのと同じように、入力してみたのですが、 サムネイル画像が、プレビュー機能で拡大して見れるようにしたいのですが、 lightbox2が機能してくれません。 http://www.oikawa-sekkei.com/web/design/js/lightbox_v2_8_1.html 因みに、jqueryは、バージョンが解らないので最新版をダウンロードして使っています。 ご回答お願いします。

みんなの回答

  • sub_sub
  • ベストアンサー率65% (15/23)
回答No.1

とりあえず、 気になるところは <script src="css/lightbox.js" type="text/javascript"></script> 個々の部分ですが css/lighbox.js であっていますか? js/lightbox.js ではどうでしょうか? 一応参考サイトを基にやってみました <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> <link href="css/lightbox.css" rel="stylesheet"> <title></title> </head> <body> <script src="js/lightbox.js"></script> <ul class="illust_work clearfix"> <li><a href="img/1.png" data-lightbox="aaa" title="gazou"><img src="img/1.png" alt="画像"></a></li> </ul> </body> </html> これで動くかと思います。 一度お試しください。