View Full Version : Rollover problem.

08-18-2008, 11:14 AM
So I managed to get some basic rollover script, and implemented it onto ym photo page of my website.

At the moment I have 3 images, and I wanted to keep the size of my website area as 800x600, however the javascript I used manages to override this, and hence I get a webpage that looks like this :


In Dreamweaver I had my layout cells drawn inside my layout table, so that one was 150 wide and the other 650 wide.

I got the code for my page off of http://www.dynamicdrive.com/dynamicindex4/thumbnail2.htm and followed it religously up to the DIV point. I am a complete noob at this, relying on educated guesses to get me through! Please help!

My page's code is:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" src="thumbnailviewer2.js" defer="defer">

* Image Thumbnail Viewer II script- &#169; Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use

<table width="800" border="0" cellpadding="0" cellspacing="0">
<td width="150" height="600" valign="top">

<a href="http://file045b.bebo.com/14/original/2008/06/07/16/6990433886a7960435891o.jpg" rel="enlargeimage::mouseover" rev="loadarea::http://danchaofan.co.uk"><img src="image1 (Custom).jpg"></a><br />
<br />
<a href="http://file041b.bebo.com/14/original/2008/06/09/19/6990433886a7981323392o.jpg" rel="enlargeimage::mouseover" rev="loadarea::http://danchaofan.co.uk"><img src="image2 (Custom).jpg"></a><br />
<br />
<a href="http://file045b.bebo.com/1/original/2008/06/09/20/6990433886a7981793949o.jpg" rel="enlargeimage::mouseover" rev="loadarea::http://danchaofan.co.uk"><img src="image3 (Custom).jpg"></a><br />
<h2 />

<td width="611" valign="top"><p>&nbsp;</p><div id="loadarea" style="width: 600px"></div> </td>
<div id="loadarea" style="width: 300px"></div>
<div id="loadarea2" style="width: 300px"></div>



Could someone please tell me how to get it so that the images stay within this 800x600 area and so that the enlarged image is to the right of the thumbnails.

Also, how do i get rid of the purple box around the outisde of the thumbnails?


08-18-2008, 12:02 PM

Download, unzip, upload, enjoy.

The picture will automatically resize every time you call it to re-open, re-open being key.