How do you setup mouse-overs?

josh6079 · Oct 4, 2006

I'm wanting to compare two pictures and be able to tranistion between the two by simply moving a mouse over the picture.

Does anyone know a somewhat easy way to do this?

gorcorps · Oct 4, 2006

<a href="#" ******="NAME******='http://bleh.jpg'" onmouseout="NAME******='http://bleh2.jpg'"><img******="http://bleh2" name="NAME" border="0"/></a>

edit: stupid friggin code

gorcorps · Oct 4, 2006

... try again:

josh6079 · Oct 4, 2006

So I upload the pics to the internet and then copy the URL and paste it in the "Name" sections?

Neverm1nd · Oct 4, 2006

You can view HTML from your local computer... just remove the http:// in the source references and put the names of your images there instead, put <HTML></HTML> around it, and save it as .htm or .html in the same directory as the pictures, double-click to open in a browser, and you should be good.
NAME is the name of the img tag, you can just leave it as it is

josh6079 · Oct 10, 2006

Okay so here are the links to my test images:

Pic 1

Pic 2

And when I try to use the code that was provided I put this:

and I place it in my address bar at the top of FireFox and it doesn't come out so good.

XD

Spacehead · Oct 10, 2006

To view it on your local computer, copy the attached code into NotePad or something & Save As an html file. Save that html file in the same folder where the 2 pictures are. Then open the html file with your browser.
I'm assuming that the names of the 2 pics you posted are the same as on your computer.

josh6079 · Oct 10, 2006

Originally posted by: Spacehead
To view it on your local computer, copy the attached code into NotePad or something & Save As an html file. Save that html file in the same folder where the 2 pictures are. Then open the html file with your browser.
I'm assuming that the names of the 2 pics you posted are the same as on your computer.

Spacehead, after I copy and paste your above code into NotePad, I click on "Save As" and when the save screen emerges it doesn't give me the option to save it as an .html document in the "Encoding" section or even the "Save as type" section for that matter.

Also, I tried copying and pasting your above code into the address bar on Firefox and it didn't do anything either.

I know I'm missing something very simple I'm sure. Thanks for the help so far but I'm still having troubles getting these two pictures to merge in any fashion. Some of the questions I have are:

[*]When it says: <a href="#" do I have to leave it as "#" or can I substitute the "#" sign for a "1" or a "2" so that it reads: <a href="1"

[*]When is says: ******="Name******= I'm assuming it's okay to substitue "Name" with "Pic1" or the like. That way it would say, ******="Pic1******=

[*]IF I did get this code right for once, how would I access the pictures? Would I just copy and paste the code in the address bar of Firefox? Would I save it in my documents somewhere and then upload it on an image hosting site like it was a picture?

Once again, thanks for all of your guys' help. I'm a retard when it comes to writing codes for things.

josh6079 · Oct 11, 2006

bump?

Neverm1nd · Oct 11, 2006

Originally posted by: josh6079
Spacehead, after I copy and paste your above code into NotePad, I click on "Save As" and when the save screen emerges it doesn't give me the option to save it as an .html document in the "Encoding" section or even the "Save as type" section for that matter.

Just select "All file types" (or whatever it reads in english) type filename.html in the name box.

Originally posted by: josh6079
Also, I tried copying and pasting your above code into the address bar on Firefox and it didn't do anything either.

Well, that's completely wrong, so no surprise there.

Originally posted by: josh6079
[*]When it says: <a href="#" do I have to leave it as "#" or can I substitute the "#" sign for a "1" or a "2" so that it reads: <a href="1"

No, leave the #

Originally posted by: josh6079
[*]When is says: ******="Name******= I'm assuming it's okay to substitue "Name" with "Pic1" or the like. That way it would say, ******="Pic1******=

Yes, but you'd have to do that substitution in all three places it occurs.

Originally posted by: josh6079
[*]IF I did get this code right for once, how would I access the pictures?

Double-click the HTML file. It should open in your default browser.

Originally posted by: josh6079
Would I just copy and paste the code in the address bar of Firefox?

No code in the address bar, please.

Originally posted by: josh6079
Would I save it in my documents somewhere and then upload it on an image hosting site like it was a picture?

I doubt image hosting sites accepts html files. Put the HTML file and both pictures in the same directory (any directory) on your local computer. Double-click the HTML file.

josh6079 · Oct 11, 2006

Okay, here is what my two jpg images look like on my computer when in the directory I'm pulling them from. Their names are "shot00017" and "shot00018". Do I substitute those names in for the "2002964631624577773_rs.jpg" and "2002946315469212445_rs.jpg" names that Spacehead gave them? And if I am supposed to substitute them should it look like this?

Because I paste the attached code below into NotePad, save it as an html (thanks for telling me how to do that) and double-click on it only to have it open up a blank white page with a Firefox image icon at the top left corner.

FeuerFrei · Oct 11, 2006

Originally posted by: josh6079
Because I paste the attached code below into NotePad, save it as an html (thanks for telling me how to do that) and double-click on it only to have it open up a blank white page with a Firefox image icon at the top left corner.

Replace name="Quakeface" with id="Quakeface" in the img tag. FF ignores the name attribute.

josh6079 · Oct 11, 2006

Replace name="Quakeface" with id="Quakeface" in the img tag.

Okay, I've renamed it to the below code and it still doesn't work. What now?

Spacehead · Oct 11, 2006

Try using this. It works for me.
Move the mouse over the FF image icon to get teh picturs to first show up.

josh6079 · Oct 12, 2006

Thankyou soooooooo much guys!!!! That did it Spacehead, I shouldn't have messed with the "http://bleh.jpg" as I can see.

Now, what if I want to make it so others on the web can see these two pictures and mouse over them? How do I do that?

Spacehead · Oct 12, 2006

Originally posted by: josh6079
Thankyou soooooooo much guys!!!! That did it Spacehead, I shouldn't have messed with the "http://bleh.jpg" as I can see.

Now, what if I want to make it so others on the web can see these two pictures and mouse over them? How do I do that?

Glad i could help.

I'm going to guess that you'll have to have your own website to do that. I don't think a picture hosting site will work.
But i should leave that question for others to answer.

josh6079 · Oct 12, 2006

Would something like a 'My Space' account work?

josh6079 · Oct 13, 2006

bump?

josh6079 · Oct 13, 2006

Would MySpace work?

How do you setup mouse-overs?

Diamond Member

aka Brandon

aka Brandon

Diamond Member

Member

Diamond Member

Lifer

Diamond Member

Diamond Member

Member

Diamond Member

Diamond Member

Diamond Member

Lifer

Diamond Member

Lifer

Diamond Member

Diamond Member

Diamond Member