PDA

View Full Version : Thumbnailviewer II: Preload image in loadarea



Fynd
03-27-2010, 03:28 PM
1) Script Title: Thumbnail Viewer II

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm

3) Describe problem:

Thanks for sharing this script! I have a question how to preload an image in the load area once opening the page.
I have 2 images, displayed as thumbs and the load area below, but when opening the page I have to move the mouse over the thumbs to get an image in the load area. I sure been searching and testing different things but no result so far.

As I understand the image doesn't get cached until mouseover=true perhaps this could be done with the help of onload or onpage or whatever.But this is a declarion in the js file I think,

My code below:


echo "<a href=\"{$row1['bildpath']}\" rel=\"enlargeimage::mouseover\" rev=\"loadarea\"><img src=\"{$row1['bildpath']}\" width=\"$width\" height=\"$height\"</a>";

echo "<a href=\"{$row2['bildpath']}\" rel=\"enlargeimage::mouseover\" rev=\"loadarea\"><img src=\"{$row2['bildpath']}\" width=\"$width\" height=\"$height\"</a><br />";

echo "<div id=\"loadarea\" style=\"width: 400px\" </div>";

Very, very greatful for any help.

Regards,
Morgan

ddadmin
03-27-2010, 11:35 PM
Actually the easiest way is just to manually add an IMG tag inside the load area DIV that shows the image you want when the page loads, for example:


<div id="loadarea" style="width: 600px"><img src="photo1.jpg" /></div>

Fynd
03-28-2010, 06:53 PM
Thanks for that! It worked. Next issue, I have different sizes of the images, I don't want to distort them and therefor only scale them down, keeping the aspect ratio. Using the a href tag doesn't allow the height and width tag. Any suggestion?