jQuery を使用して、サムネイルをクリックすると画像が読み込まれる単純なライトボックスを作成しました。
メインギャラリー画像をロードする変数としてサムネイル src を保存することにより、ライトボックスを機能させようとしています。ただし、変数には、より大きなギャラリー画像を見つけるために、src の削除の「/thumbs」部分が必要です。
この質問のバリエーションに対して既に与えられた多数の回答に従いましたが、結果をエミュレートする試みはどれもうまくいかないようです。
私はこれまでに得ました:
$("#attractions-dave li a").live("click", function showAttraction(e){
var example = $(this).children('img').attr('src', $(this).children('img').attr('src').replace('/thumbs',''));
});
参考までに、関連する html は次のとおりです。
<ul id="attractions-dave">
<li>
<a href="../attractions/attractions.php">
<img src="../images/photos/bouncy-castles/thumbs/happyclown.jpg" alt="happy clown castle" />
</a>
</li>
</ul>
変数を取得したら、次のコードを使用して背景画像を設定します。
$('#example').css('background-image', 'url(' + example + ')');
現時点では、コードは要素に背景 css を追加していません。
このコードでエラーは発生していませんが、変数 (修正されたサムネイル src) が認識されていないことは明らかです。
誰かが私が間違っているところを見ることができれば、どんな助けも大歓迎です。