Photo Gallery

[KieranM]

Hi I am sorry and am new to javascript,

I am attempting to create a photo gallery.

As standard the a resized thumbnail on the left of the page has a url
to the main picture at the centre of the page.
At the moment each thumbnail links to a separate page with the correct
fullsize picture of the image.

I was wondering whether there was a way of clicking the thumbnail and
auto changing the url of the main image thus appearing to change the
page.

From what I understand of javascript it preloads the images in this

instance, but due to the fact that the users will be using low speed
connections I was wondering whether there was any other way.

Sorry if this is ambiguous.

Regards
Kieran

 

[Peter Michaux]

Hi I am sorry and am new to javascript,

I am attempting to create a photo gallery.

As standard the a resized thumbnail on the left of the page has a url
to the main picture at the centre of the page.
At the moment each thumbnail links to a separate page with the correct
fullsize picture of the image.

I was wondering whether there was a way of clicking the thumbnail and
auto changing the url of the main image thus appearing to change the
page.

instance, but due to the fact that the users will be using low speed
connections I was wondering whether there was any other way.

Hi,

I think this would be a very basic way to get the job done. It isn't
elegant but it might make sense and be good if you are just learning
JavaScript.

<img src="paris-thumb.jpg"
onclick="document.getElementById('big').src='paris.jpg';">
<img src="rome-thumb.jpg"
onclick="document.getElementById('big').src='rome.jpg';">

<img id="big" src="paris.jpg">

 

[Peter Michaux]

Peter Michaux wrote:

"JavaScript The Definitive Guide" by Flanagan is a good book.

Oops! I need to be more careful. This is not necessarily a good book
according to everybody here. But it is the book recommended by this
group as a whole. It is on my desk all the time.

Peter

 

[ASM]

KieranM a écrit :

Hi I am sorry and am new to javascript,

I am attempting to create a photo gallery.

As standard the a resized thumbnail on the left of the page has a url
to the main picture at the centre of the page.
At the moment each thumbnail links to a separate page with the correct
fullsize picture of the image.

I was wondering whether there was a way of clicking the thumbnail and
auto changing the url of the main image thus appearing to change the
page.

You can do that with quite simple css ...
No JavaScript needed.
http://stephane.moriaux.perso.orange.fr/truc/galerie_1.htm
without post nor pre loading big images
to get a new big image will need few moment !

instance, but due to the fact that the users will be using low speed
connections I was wondering whether there was any other way.

you can postlod images instead to preload them

To do not wait too much you can have 3 thumbnails displayed at same
time, and javascript postloads the 3 big images and forth one to.
Sliding the 3 thumbnails to the 4th does postload fith big image.

Result :
when you click thumbnail, big image is ready and is displayed immediatly
http://stephane.moriaux.perso.orange.fr/truc/popup_image_auto_4