※ ChatGPTを利用し、要約された質問です（原文：jQuery LightBox Plugin動かず）
jQuery LightBox Plugin動かず
このQ&Aのポイント
jQuery LightBox Pluginを使用して画像をLightBoxで表示したいが、動作しない
参考ページからダウンロードしたファイルを適用したが、画像のページが開かれてしまう
JavaScriptやCSSをhead内にコピーし、a要素にrel="lightbox"を追加したが、なぜか動かない
jQuery LightBox Plugin動かず
複数の画像をLightBoxで表示したくて
http://shanabrian.com/web/library/jlightbox.php#option
のページ参考にテストしてみました。紹介されてるダウンロードページからデータを取得し、
解凍後、css、images、jsディレクトリを適用するファイルと同じディレクトリに設置しました。
そしてJavaScriptおよびCSSをhead内にコピーし
a要素にrel="lightbox"を追加
これで完了のはずですが、しかし動作しません。
画像のページが開いてしまいます。なぜ動かないのでしょうか？
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>テスト</title>
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.lightbox-0.5.js"></script>
<script type="text/javascript">
$(function() {
$('#gallery a').lightBox();
});
</script>
</head>
<body>
<a href="images/sample1.jpg" rel="lightbox"><img src="photos/image1.jpg" width="200" height="300"></a>
<a href="images/sample2.jpg" rel="lightbox"><img src="photos/image2.jpg" width="200" height="300"></a>
<a href="images/sample3.jpg" rel="lightbox"><img src="photos/image3.jpg" width="200" height="300"></a>
</body>
</html>
お願いします。
お礼
有難うございます。 できました。 また、他の方法も見つけました。 rel"lightbox[group]"というふうにしたらできました。 <a href="images/sample1.jpg" rel="lightbox[group]"><img src="photos/image1.jpg" width="200" height="300"></a> <a href="images/sample2.jpg" rel="lightbox[group]"><img src="photos/image2.jpg" width="200" height="300"></a> <a href="images/sample3.jpg" rel="lightbox[group]"><img src="photos/image3.jpg" width="200" height="300"></a>