2 replies [Last post]
neoformat
neoformat's picture
Offline
Regular
Moscow
Last seen: 9 years 18 weeks ago
Moscow
Timezone: GMT+2
Joined: 2007-02-22
Posts: 25
Points: 3

Hello guys!

I've got another problem. If I am right I can not use onMouseOver onMouseout in xhtml so another way is to use css. Can you help me please?

On my web http://dimasnet.com on the right sideare two images - diary1.jpg and diary2.jpg:

diary1 is defined so:

#diary1

{
float: left;
width: 80px;
padding-top: 100px;
display: inline;
padding-right: 0px;
}

I want to take away javascrpt elements onMouseOver from there and use css to roll images. How can I do that? I think I have to place every image to a different < div > with diary1.a diary1.a hover class. But I dontknow how to correctly set div class parameters I am afraid of floats Sad

Please help!!!!

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 1 year 50 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

Ok Let us assume you

Ok

Let us assume you replaced your html with this:

About Dimas

Then your css might look like this:

div#about a{ text-indent:-99999em; background: url(../images/diary-new.jpg) no-repeat; display:block; height:189px; width:152px; } div#about a:hover{ background: url(../images/diary-new.jpg) 0 -189px no-repeat; }

Stitch the 2 jpgs together, the normal on top, the hover under it, making it 378px high.

Well, I gues the link code needs some work, but the idea is there. I have NOT tested this, so I might have made a c*ck up

neoformat
neoformat's picture
Offline
Regular
Moscow
Last seen: 9 years 18 weeks ago
Moscow
Timezone: GMT+2
Joined: 2007-02-22
Posts: 25
Points: 3

Thank you, master!! It

Thank you, master!! It works!! Youar genius Smile