PDA

View Full Version : i tried but i failed w/ image flips

HardyzGurL87
05-04-2003, 12:25 AM
:( i searched and searched for help on this and i still can't understand what i'm doing wrong..

http://www20.brinkster.com/nstonline/biographies.html

can someone view my HTML and please tell me what idiot mistakes i'm making??
Cherchezlafemme
05-04-2003, 12:56 AM
Ahhh you should of said you wanted three pics OHHHHHHHHH!!!
Why dont you search the WWW?
HardyzGurL87
05-04-2003, 01:14 AM
I've tried, maybe i didn't search hard enough. i'll try some more detailed searches.. and if i still don't find anything. i will definitely let this forum know. heh :)
HardyzGurL87
05-04-2003, 01:57 AM
I've searched and searched and searched... all i can find are things on how to make multiple images flip with each other.. like having different images make the same other image change, but nothing on 3 separate image flips! i'm going insane. gahhh. if ANYONE knows how to do it, please let me know :(
Elentari
05-04-2003, 02:00 AM
I'll try to help you out as best as I can. What do you mean by image flips? Do you want the image to go upside when you have on it or something?
HardyzGurL87
05-04-2003, 02:04 AM
nope, by image flip i mean i have 6 images i am using. i need them to be paired together. the first image needs to change to another one when you do a mouseover, then the second image needs to change to another with you mouseover and same thing with the third image. get what i'm saying? i'm really bad at explaining. on this page- http://www20.brinkster.com/nstonline/biographies.html i have the three images lined up and i want each one to change to a different image when you move your mouse on each one.

do you understand what i'm asking? can you help?
Elentari
05-04-2003, 02:05 AM
Ahh ok, simple enough, you just want a simple mouseover using images. Gimme one sec and I'll write out your code.
Elentari
05-04-2003, 02:20 AM
This section goes inbetween the <HEAD></HEAD> tags...


!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!

<Script Language="JavaScript">
isamap = new Object();
isamap[0] = "_df"
isamap[1] = "_ov"


function isimgact(id, act)
{
if(document.images) document.images[id].src = eval( "isimages." + id + isamap[act] + ".src");
}

if (document.images) { // ensure browser can do JavaScript rollovers.
isimages = new Object();
isimages.Buttons_df = new Image();
isimages.Buttons_df.src = "pic1.jpg";

isimages.Buttons_ov = new Image();
isimages.Buttons_ov.src = "pic1alt.jpg";

isimages.Buttons1_df = new Image();
isimages.Buttons1_df.src = "pic2.jpg";

isimages.Buttons1_ov = new Image();
isimages.Buttons1_ov.src = "pic2alt.jpg";

isimages.Buttons2_df = new Image();
isimages.Buttons2_df.src = "pic3.jpg";

isimages.Buttons2_ov = new Image();
isimages.Buttons2_ov.src = "pic3alt.jpg";

}
// end JavaScript. -->
</Script>

!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!!!!!!!!!!!!!!!!!!



And then this is a table containing the pictures that will be the links...This goes in the body where you want the link images. Obviously be sure to change all the style things like the position to where you want it and make sure you do all the measurements according to your pictures.


<Table Border="0" CellSpacing="0" CellPadding="0" style="position:absolute; left:500; top:14">
<Tr>
<Td Width="12" Height="16"></Td>
<Td Width="150" Height="16"></Td>
</Tr>
<Tr>
<Td Width="12" Height="35"></Td>
<Td Width="150" Height="35"><a Href="http://www.pic1link.com" OnMouseOut="isimgact( 'Buttons',0)" OnMouseOver="isimgact( 'Buttons',1)" ><Img Src="pic1.jpg" Border="0" Height="35" Width="150" Name="Buttons" Alt="Pic 1 Link"></a></Td>
</Tr>
<Tr>
<Td Width="12" Height="6"></Td>
<Td Width="150" Height="6"></Td>
</Tr>
<Tr>
<Td Width="12" Height="35"></Td>
<Td Width="150" Height="35"><a Href="http://www.pic2link.com" OnMouseOut="isimgact( 'Buttons1',0)" OnMouseOver="isimgact( 'Buttons1',1)" ><Img Src="pic2.jpg" Border="0" Height="35" Width="150" Name="Buttons1" Alt="Pic 2 Link"></a></Td>
</Tr>
<Tr>
<Td Width="12" Height="6"></Td>
<Td Width="150" Height="6"></Td>
</Tr>
<Tr>
<Td Width="12" Height="35"></Td>
<Td Width="150" Height="35"><a Href="http://www.pic3link.com" OnMouseOut="isimgact( 'Buttons2',0)" OnMouseOver="isimgact( 'Buttons2',1)" ><Img Src="pic3.jpg" Border="0" Height="35" Width="150" Name="Buttons2" Alt="Pic 3 Link"></a></Td>
</Tr>
</Table>
HardyzGurL87
05-04-2003, 02:39 AM
*bows down ,worships your knowledge*

i have been trying to make this ALLLLL day. it FINALLY works.. wow you are a life savior and now you own my soul.. lol

thank you so much!!
Elentari
05-04-2003, 02:41 AM
*lol* No problem. I like your layout btw.

Just checked out your page. Don't forget to change the alt text so that when someone hovers over your pics it doesn't say pic1 or pic2 but rather their names or something?
Elentari
05-04-2003, 02:47 AM
And if you want it centered in the page like it was before, add this in your CSS body tag...

text-align:center;
HardyzGurL87
05-04-2003, 02:06 PM
oh yeah, i forgot about that. woops. and again, thank you :)