Problems with simple image loading script

[croydon86]

I am trying to implement a simple script of image thumbnails, that when clicked, display a larger image.

I am trying to do this without using an existing plugin.

Here is my current code.

$(‘#thumbnails ul li’).click(function() {
$(‘#main’).attr(‘src’, $(this).attr(‘src’).replace(‘small/’, ‘large/’));});​

Can someone please let me know what I am doing wrong? I have also upload the whole code here… http://jsfiddle.net/PjrFe/

Thanks in advance guys.

[TheDoc]

I’ve done one that breaks it down a little more: http://jsfiddle.net/PjrFe/19/

I’m sure this can be made more efficient by somebody that knows what they’re doing, but at least it works!

[croydon86]

Thanks TheDoc, yes that does seem to work. I also figured it out…

$(‘#thumbnails ul li’).click(function(){
$(‘#main’).attr(‘src’,$(this).find(‘img’).attr(‘src’).replace(‘small/’, ‘large/’));
});

It turns out I was just missing the .find element.

Thanks anyway ;)

I just need to make it fade in more smoothly now.

[Author]

Posts