• We’re currently investigating an issue related to the forum theme and styling that is impacting page layout and visual formatting. The problem has been identified, and we are actively working on a resolution. There is no impact to user data or functionality, this is strictly a front-end display issue. We’ll post an update once the fix has been deployed. Thanks for your patience while we get this sorted.

How do you setup mouse-overs?

J

josh6079

Diamond Member
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?
 
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
 
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
 
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.
 
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.
Click to expand...

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.
 
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.
Click to expand...
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.
Click to expand...
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"
Click to expand...
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******=
Click to expand...
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?
Click to expand...
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?
Click to expand...
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?
Click to expand...
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.

 
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.
 
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.
Click to expand...

Replace name="Quakeface" with id="Quakeface" in the img tag. FF ignores the name attribute.
 
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?
 
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?
Click to expand...

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.
 
You must log in or register to reply here.

TRENDING THREADS

Back
Top