I'm working on a site right now for a make-up artist, and I'm setting up an image gallery with thumbnail images on the bottom of the page. When the mouse is rolled over each image, the larger image appears in a central area on the page.
I notice a few errors where the page starts jumping... What I mean is that the bottom part of the page will automatically resize itself when an image appears (The image area is LARGER than the image itself, leaving enough space)...
Does anyone have any recommendations on correcting this, as well as recommendations in general on setting up these type of galleries?
Any help is appreciated!
If you are using tables for this, the best thing you could do is split the cell that shows the image into two. On the left, make the column ONE pixel wide and insert a transparent gif that is the same height as your LARGEST picture.
On the right (where your large pictures will appear), make sure VALIGN="center" and ALIGN="CENTER" are set on the <TD> tag and you should be OK.
The transparent gif will stop the table from jumping and the "CENTER" tags will stop the images from appearing all over the shop.
If this is what you mean, give it a go! If not, ignore me, I'm a fool :D
Another way of solving this problem, without resorting to tables is by using layer. This way you could preload all of the images.
This will take a while longer, though will end up saving time without having the half complete images being displayed.
Hope this helps