New picture when hovering over pictures? Options

[OMGitsQuinton]

Okay, www.myspace.com/omgitsquinton this is my profile. I was wondering instead of having a flip effect if there was someway for all of my images to have like a different image on it when I hover over.. like say for one of my friends pictures to change to another picture of them when I hover over it.. and hopefully without it effecting the text hover..

Thank you, and I've seen this done on somebody's profile before, but I don't know the code.

[Pulchritude]

hmm let me try to explain as detailed as I can.
Like toya said you have to make your own custom friend's list.

First you gotta make an image on photoshop or ms paint and make the width 100 and the heigh 200 like the one showed in the tutorial.

Then upload your image on ImageShack

Then second you got to start off with the style of your picture links.

CODE

<style type="text/css">
.friend{height: 100px; width: 100px; text-indent: 15px; overflow: hidden; background: url(http://c.myspace.com/Groups/00005/26/66/5986662_l.jpg) top left no-repeat; display: block;}
.friend:hover{background-position: bottom left;}
</style>

You start off with a class. The class of this code is .friend, you can see it in .friend and .friend:hover

Now leave the height and width alone in the code. Take the url code of the image you upload at imageshack and paste it in where it says this

CODE

(http://c.myspace.com/Groups/00005/26/66/5986662_l.jpg)

So just leave everything else alone.
Then go on to the actual link

CODE

<a href="link_2_friends_profile" class="friend">Friends Name</a>

Take your friend's myspace link and paste it in where it says

CODE

"link_2_friends_profile"

Then type your friends name where it says Friends Name and I would like to point out the class where it says class="friend" like in the style code.

So for every picture/link you do you got to make a new class for example

CODE

<style type="text/css">
.fried{height: 100px; width: 100px; text-indent: 15px; overflow: hidden; background: url(http://c.myspace.com/Groups/00005/26/66/5986662_l.jpg) top left no-repeat; display: block;}
.fried:hover{background-position: bottom left;}
</style>

See how I changed .friend to Fried (you can use any name you want). So then you also gotta do it for the link

CODE

<a href="link_2_friends_profile" class="friend">Friends Name</a>

change

CODE

class="friend"

to fried and add your second friend's myspace link and name.

and place all the

CODE

<a href="link_2_friends_profile" class="friend">Friends Name</a>

in where you want your friend's lsit to show up.

Well I hope I made it more detailed. I'm also new to roll overs so anyone go ahead and correct me if I'm wrong