W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > April to June 2003

RE: image rollvers in css - example

From: Jim Allan <jimallan@tsbvi.edu>
Date: Wed, 21 May 2003 12:35:56 -0500
To: "Hoffman, Geoffrey" <ghoffman@aztrib.com>
Cc: WAI-IG <w3c-wai-ig@w3.org>
Message-id: <HDEAKIPKOHBCMDILOOPNCEJBGGAA.jimallan@tsbvi.edu>

Geoff,
very nice!
if you add the following to your style sheet you can achieve the
"mouse-over" effect from the keyboard as well.

/* for IE 5.x keyboard "mouse-over" effect */
.fade:active {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; BACKGROUND-IMAGE:
url(bgtile2.jpg); PADDING-BOTTOM: 5px; COLOR: #040; PADDING-TOP: 5px;
BACKGROUND-REPEAT: repeat-x; FONT-FAMILY: sans-serif; TEXT-DECORATION:
underline
}

/* for netscape 6.x keyboard "mouse-over" effect */
.fade:focus {
	PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-WEIGHT: bold; BACKGROUND-IMAGE:
url(bgtile2.jpg); PADDING-BOTTOM: 5px; COLOR: #040; PADDING-TOP: 5px;
BACKGROUND-REPEAT: repeat-x; FONT-FAMILY: sans-serif; TEXT-DECORATION:
underline
}

Jim Allan, Webmaster & Statewide Technical Support Specialist
Texas School for the Blind and Visually Impaired
1100 W. 45th St., Austin, Texas 78756
voice 512.206.9315    fax: 512.206.9264  http://www.tsbvi.edu/
"I see the Earth. It is so beautiful."--first words spoken by human in
space.
[Yuri Alekseevich Gagarin, from the Vostok 1, April 12, 1961.]


-----Original Message-----
From: w3c-wai-ig-request@w3.org [mailto:w3c-wai-ig-request@w3.org]On
Behalf Of Hoffman, Geoffrey
Sent: Wednesday, May 21, 2003 10:57 AM
To: w3c-wai-ig@w3.org
Subject: RE: image rollvers in css - example



Section 508.US wrote:
> I have been following the thread on CSS replacement for java script.
> Geoff gave a wonderful example. I was wondering if anyone would be
> willing to show me that code.

I've been working a lot lately trying to use XHTML, CSS and Divs instead of
tables... so I had some CSS handy to whip up an example:

http://members.cox.net/salientdigital5/

Seems to work fine in IE 5, 6, Op7, NS7

-Geoff

---
Incoming mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.474 / Virus Database: 272 - Release Date: 4/18/2003

---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.474 / Virus Database: 272 - Release Date: 4/18/2003
Received on Wednesday, 21 May 2003 13:38:45 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Tuesday, 19 July 2011 18:14:09 GMT