Trying to do a mouse-over floating preview

[yerk5]

I'm trying to make use of one of those popular scripts you see all over
the web these days, where you mouse over a image or link and you get a
floating preview of something before you click it.

Basically, if you go to www.templatemonster.com and mouse over a
template, that's the exact effect I want. So I viewed their source, and
saw that they got the script from here:

http://www.javascriptkit.com/script/script2/simpleimagetrail.shtml

But they greatly modified it. If you check out the script from
javascriptkit.com, it just makes the image visible at all times. I
modified it to perform as I want, which you can see here:

http://abate.veritynet.net/~d77/float

You can see I got it doing exactly what I want, but now let's say I
want the effect to happen for 2 different pics on the same page. I
wouldn't know where to begin.

Again, I tried viewing the templatemonster source. In fact I tried
"borrowing" it. But I just can't get it to perform like they have it. I
downloaded all their .js files and recreated the same directory
structure, but I'm just missing something somewhere. Besides, I dont
want to just steal someone else's work. But I do want to get it working
like that.

Anyone have and pointers, or know of another free script out there that
will perform this effect? TIA

 

[Jake Barnes]

http://www.javascriptkit.com/script/script2/simpleimagetrail.shtml

But they greatly modified it. If you check out the script from
javascriptkit.com, it just makes the image visible at all times. I
modified it to perform as I want, which you can see here:

http://abate.veritynet.net/~d77/float

You can see I got it doing exactly what I want, but now let's say I
want the effect to happen for 2 different pics on the same page. I
wouldn't know where to begin.

this is what they do:

function gettrailobj(){
if (document.getElementById)
return document.getElementById("preview_div").style
}


but this is what you do:

function gettrailobj(){
if (document.getElementById)
return document.getElementById("trailimageid").style
else if (document.all)
return document.all.trailimagid.style
}


You're getting the style for the image itself, whereas they are getting
the style for the preview div. I didn't look at it too closely, but I
assume that they are putting different images in the preview div
depending on what is being moused over.

Your method, getting the image style, is flawed because it only allows
for one image to be on the page. Their method works better. They only
have one preview div on the page, but they can move different images
into and out of it easily enough.