Hatrack River Forum: HTML Question!

This is topic HTML Question! in forum Books, Films, Food and Culture at Hatrack River Forum.

To visit this topic, use this URL:
http://www.hatrack.com/ubb/main/ultimatebb.php?ubb=get_topic;f=2;t=023067

Posted by A Rat Named Dog (Member # 699) on :

Hey, how do I set up an image so that when you hover over it with your mouse, it switches to a different image? Can that be done in raw HTML, or does it require something extra?

Posted by Hobbes (Member # 433) on :

On believe you use the "onmouseover" command but it's been a long time sicne I did any decent raw html.

Hobbes [Smile]

Posted by jeniwren (Member # 2002) on :

I thought onmouseover (or whatever it is) was javascript. I haven't touched either in too long to remember.

Posted by A Rat Named Dog (Member # 699) on :

It is javascript, but I managed to make it work: www.geoffreycard.com ...

Now, I think my only problem is the size of the images. They're like 5K each, and it takes a second to switch when you mouseover them. (I've only done the top link so far.)

Posted by SoberTillNoon (Member # 6170) on :

The effect is called a rollover.

That is a very nice site there. I like how you used the rollover effect.

[ April 03, 2004, 08:31 PM: Message edited by: SoberTillNoon ]

Posted by fugu13 (Member # 2859) on :

What you need to use is called a preload script, so the rollover images are already downloaded when you need them.

Just google for preload script and take your pic.

Also, you may find it useful to generate rollovers and such using software like Adobe's ImageReady (companion software to photoshop). It generates javascript code for you.

Posted by Chris Bridges (Member # 1138) on :

Geoff, are these your final versions of the images? Your rollovers aren't coming up 5k, they're more like 10 - 17k each, which might be why they're taking so long to come up.

I grabbed some of your images and scrunched 'em down to about half the sizes: http://www.chrisbridges.com/temp

[ April 03, 2004, 08:25 PM: Message edited by: Chris Bridges ]

Posted by MoonRabbit (Member # 3652) on :

Email me (profile email) and I'll send you your html page with the preloader installed.

Posted by vwiggin (Member # 926) on :

Ha! Card Catalog. That's great. [Smile]

Posted by A Rat Named Dog (Member # 699) on :

Hey, come on, guys, I can't learn anything if you do all the work for me! [Smile]

And holy crap, I'd be in big trouble by now if I didn't know how to compress a JPEG [Smile]

I'm just sticking to the bigger files while I'm still working on them ... to ensure the finest quality and all.

Posted by sarcasticmuppet (Member # 5035) on :

quote:
Ha! Card Catalog. That's great.

Posted by Jon Boy (Member # 4284) on :

Geoff, I believe that if you look at the finished code with the preloader, you should be able to reverse-engineer it and make your own.