私はサムネイルで作ったjquery scrollerを持っていますが、私はミニスクリプトを作成しようとしています。画像を切り替えるには
ユーザーは親指の爪をクリックすると、それはこのようなコードを更新します。
<div id="big_image">
<img src="HERE.jpg" alt="my image"/>
</div
あなたはスクロールバーの上にサムネイルをクリックすると、だから、ページ上のIMGタグのSRCを更新？どのように私は始めることができる任意のアイデア？
$('#scroller img').click(function() {
$('#big_image img').attr('src', whatever_full_size_image_src_is_for(this));
}
// Replace larger image with src of whatever thumbnail you clicked
$("img.myImage").click(function(){
$("img.bigImage").attr("src", $(this).attr("src"));
});
注あなたはサムネイルのサイズに拡大イメージを破砕している場合を除き、これはあなたの問題に非常にエレガントな解決策ではありません。そしてすべての正直なところで、がサムネイルサイズに大きな画像を破砕している場合、それは非常に良い解決策ではありません。
大きな画像を表示してサムネイルを表示するために、フルサイズの画像にimage-name-full.jpgを意味するテキストを追加する場合はどうすればよいですか？ – Coughlin
function updateImage()
{
$("#big_image > img").attr("src","imagePath");
}
サムネイルonclickイベントでこの機能を使用できます。
この回答と私の答えの違いは、実際にはセレクタの ">"文字です。 >とは、私の例ではすべての子孫の代わりにこの直接的な子どもを選択することを意味します。つまり、すべての子孫ではなく、子のimgのみが選択されます。 – Tarik
それは本当ですが、Aaron、私はIDが単数であることに基づいて#big_pictureがその子として単一のIMG以上を保持するとは思わない。 – Sampson