[jQuery] Re: Best practice for image source change

2007-04-10 Thread Oddish

Thanks a lot tobaco! That's much better! Thanks also to Will Kelly!

On Apr 5, 1:36 pm, "tobaco" <[EMAIL PROTECTED]> wrote:
> you could this also do it this way:
>
> 

[jQuery] Re: Best practice for image source change

2007-04-05 Thread Will Kelly



I wrap each thumbnail with a link:



This is the amateurish jQuery code I've conjured up:

$("a#tnLink01").click(function() {
   $("#mainImage").attr({src:"another_large_image.jpg"});
});

I'll need one of these functions for every thumbnail and that seems
wrong somehow, so I'd really appreciate any helpfil tips and
strategies for switching a larger image when clicking thumnails.


You could make your css query less specific.
You could also automatically generate a large image url based on the content 
of your thumbnail ie.


$("div.thumbnails img").click(function() {
   var large_img = $(this).attr('src').split(".").shift() + '_large.jpg' 
//gets image src part before period, adds suffix

$("#mainImage").attr('src'.large_img);
}

Above example is simple and assumes image on has 1 period in it!

Hope that helps,
Will






[jQuery] Re: Best practice for image source change

2007-04-05 Thread tobaco

you could this also do it this way:



$("a.images").click(function() {
 var large_img = $(this).attr('href');
 $("#mainImage").attr('src', large_img);
 return false;
});

this way it's more accessible for users without javascript


On 5 Apr., 12:49, "Oddish" <[EMAIL PROTECTED]> wrote:
> I've got a bunch of thumbnails, and when clicking these thumbnails, a
> larger image is supposed to change. I do this by changing the src
> attribute of the larger image, but I'm very new to jQuery so I was
> wondering about the best way to accomplish this. Right now, I've got
> this working code, but maybe it can be optimized?
>
> I wrap each thumbnail with a link:
>
>  alt="" />
>
> This is the amateurish jQuery code I've conjured up:
>
> $("a#tnLink01").click(function() {
> $("#mainImage").attr({src:"another_large_image.jpg"});
>
> });
>
> I'll need one of these functions for every thumbnail and that seems
> wrong somehow, so I'd really appreciate any helpfil tips and
> strategies for switching a larger image when clicking thumnails.