PDA

View Full Version : hover code!!


berry05
03-16-2008, 06:38 PM
for 3 days ive been trying to figure out ow to hover text!
i have these 4 tabs that are images and in the tabs there is text! I know how to add text in the image but i dont know how to make the text a hover text or w/e...i want it so that when someoens mouse hovers over the text the text changes color and it is clickable...so its a hover text and it a hyperlink..can anyone give me a simple code for hovering text so it changes the color..i can edit the code so it turns red...from black to red... the text is already black...so can anybody give me a code for that..that'll be great!

Red Leader
03-16-2008, 07:19 PM
a.myClass {
color:black;
}

a.myClass:hover {
color:red;
}


<a href="#" class="myClass">Catfood</a>

effpeetee
03-16-2008, 07:24 PM
berry05,

Did you see my last post on your previous post.

Just in case you need it, I am posting the code that works.
Or are you after a menu?

if so try here

http://www.dynamicdrive.com/style/CS...y/category/c1/
http://css.maxdesign.com.au/listutorial/index.htm
http://www.cssplay.co.uk/menus/


Frank

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="http://www.lockedforums.com" />

<title>Testing</title>
<style type="text/css">

/*Adding this helps with FFox. */

* {
margin: 0;
padding: 0;
border: none;
}
html, body {
height:100%;
width:100%;
}
#caption{
Z-INDEX: 101;
LEFT: 235px;
WIDTH: 258px;
POSITION: absolute;
TOP: 374px;
HEIGHT: 21px;
border: 2px solid red;
text-align: center;
}
<p style="COLOR: #ffffff; BACKGROUND-COLOR: #00364a">
body {
background-color: #999999;
}
p.c1 {text-align: center;
}

</style>
</head>

<body>
<img src="http://i29.tinypic.com/r8v5fc.png" >

<p class="c1"><img src="http://www.lockedforums.com/lcorner.jpg" >
<b>Home</b>
<img src="http://www.lockedforums.com/edit%20act.jpg" >
<img src="http://www.lockedforums.com/first_tab_gr_downloads_inactive.jpg" >
<img src="http://www.lockedforums.com/last.jpg.jpg" ></p>

<div id="caption"> <p>Yes but a very nice photo.</p>
</div>

</body>
</html>