Rollover Help

I am creating a web page with multiple event rollovers. There
are 9 thumb nails on the page. Each thumbnail will have a multiple
event rollover. All the roll over images are different sizes. The
problem I am having is when I rollover the thumbnail the picture
expands or contracts to the size of the gif. Will I have to resize
all pictures to be the same? The effect I would like to have is at
this web page www.devine-pearson.com/page.cgi/2/9/. How were they
able to have each image rollover in the same area with a different
image. I am more of a designer and not that great at coding so
looking at the page source didn't help me all too much. Any help
will be greatly appreciated. thanksRollover Help
Here's a simple script.

Assuming your thumbnails are called thumb1.gif, thumb2.gif,
thumb3.gif ...

thumb9.gif

and the corresponding larger images are called large1.gif,
large2.gif ....

large9.gif





%26lt;HEAD%26gt;

%26lt;SCRIPT language=''JavaScript''%26gt;

%26lt;!--

function showimg(imgName,imgLoc)

{

if (document.images)

{

document[imgName].src= imgLoc+''.gif'';

}

}

//--%26gt;

%26lt;/SCRIPT%26gt;

%26lt;/HEAD%26gt;

%26lt;body%26gt;

%26lt;div%26gt;%26lt;img src=''thumb1.gif''
onMouseOver=''showimg('largeimg','large1');''

onMouseOut=''showimg('largeimg','spacer');''%26gt; %26lt;br%26gt;

%26lt;img src=''thumb2.gif''
onMouseOver=''showimg('largeimg','large2');''

onMouseOut=''showimg('largeimg','spacer');''%26gt; %26lt;br%26gt;

... and so on ... to

%26lt;img src=''thumb9.gif''
onMouseOver=''javascript:showimg('largeimg','large9');''

onMouseOut=''showimg('largeimg','spacer');''%26gt;

%26lt;/div%26gt;

%26lt;div%26gt;%26lt;img name=''largeimg'' src=''spacer.gif'' alt=''''
width=''250px''

heigh=''250px''%26gt;%26lt;/div%26gt;

%26lt;/body%26gt;





The script basically says that when you rollover a thumb
image, change the

source of the image named ''largeimg'', which is the place
where you want to

show all the large images, to the parameter given by the
onMouseOver and

onMouseOut replace this with a transparent spacer.gif image.
To start with

the image names ''largeimg'' is a transparent spacer and actual
images are

shown only onMouseOver.

You would need to use an image preloader to avoid delay in
showing of the

larger image.



--

You cannot lose until you give up !!!

''Squall1977'' %26lt;webforumsuser@macromedia.com%26gt; wrote in
message

news:f22vgj$5bp$1@forums.macromedia.com...

%26gt;I am creating a web page with multiple event rollovers.
There are 9 thumb

%26gt;nails

%26gt; on the page. Each thumbnail will have a multiple event
rollover. All the

%26gt; roll

%26gt; over images are different sizes. The problem I am having
is when I

%26gt; rollover the

%26gt; thumbnail the picture expands or contracts to the size
of the gif. Will I

%26gt; have

%26gt; to resize all pictures to be the same? The effect I
would like to have is

%26gt; at

%26gt; this web page www.devine-pearson.com/page.cgi/2/9/. How
were they able to

%26gt; have

%26gt; each image rollover in the same area with a different
image. I am more of

%26gt; a

%26gt; designer and not that great at coding so looking at the
page source didn't

%26gt; help

%26gt; me all too much. Any help will be greatly appreciated.
thanks

%26gt;