Rollover Text

Wolfmans55

03-02-2005, 12:35 AM

What's the code for links so that when you roll your mouse over them they will change color? Thanks.

Daf

03-02-2005, 12:39 AM

Hi,

Here are few links that will help you with this. :) I did a search for "css rollovers" and got several pages worth of articles/tutorials.

http://ecoculture.com/styleguide/r/rollovers.html
http://www.alistapart.com/articles/rollovers/
http://www.webreference.com/new/rollovers/
http://www.meyerweb.com/eric/css/edge/menus/demo.html

There were gads more so you may want to try your own search. :)

Hope this helps

Daf

rmedek

03-02-2005, 12:53 AM

Generally, the a psuedo-class takes care of this.

a:link {color: whatever} /* color of the link */
a:visited {color: whatever} /* color of a visited link */
a:hover {color: whatever} /* color of a hovered (rollover) link */
a:active {color: whatever} /* color of an active (clicked on) link */

It has to be in that order (link, visited, hover, active) or it won't work.

Wolfmans55

03-02-2005, 12:55 AM

Oh alright thank you. I'm sorry I have another question thought because I'm kinda new but if you view this code in a browser, why doesn't the affiliates table align to the right of the center table?

<HTML>

<HEAD>
<TITLE>Halo 2 Files</TITLE>

<style type="text/css">

body
{
//color: #1A2E57;
color: #0D09B4;
background-color: #1A2E57;
font-family: Lucida Sans Unicode;
font-size: 10;
font-weight: bold;
}

.banner
{
width: 780px;
border: 1px white solid;
margin-left: -10px;
margin-right: -10px;
margin-top: 0px;
margin-bottom: 20px;
background-color: black;
}

.center
{
width: 225px;
text-align: center;
border: 1px white solid;
margin-left: 267px;
margin-right: 267px;
margin-top: 10px;
margin-bottom: 10px;
background-color: black;
}

.left
{
width: 250px;
text-align: left;
border: 1px white solid;
margin-left: -10px;
margin-right: 400px;
margin-top: -26px;
margin-bottom: 10px;
background-color: black;
}

.right
{
width: 250px;
text-align: center;
border: 1px white solid;
margin-left: 520px;
margin-right: -10px;
margin-top: -26px;
margin-bottom: 10px;
background-color: black;
}

</style>
</HEAD>

<BODY>

<div class="banner">
Hi

</div>

<div class="center">
Welcome to Halo 2 Files.
</div>

<div class="left">
Navigation
<hr width=100%>

<BODY VLINK="#FFFFFF" ALINK="#FF0000">

<a href="#">Home</a>
<br>
<a href="#">News</a>
<br>
<a href="#">Glitches</a>
<br>
<a href="#">Custom Games</a>
<br>
<a href="#">Videos</a>
<br>
<a href="#">Player Created Videos</a>
</alink>
</vlink>

</div>

<div class="right">
<v align="right">
Affiliates
<br>
<br>
<br>
</div>

rmedek

03-02-2005, 12:59 AM

Because "<v align="right">" is a tag that exists only in your imagination. :)

Why not post this in a new thread instead of dragging this one on? It'll help with the forum searches, and help people answer your question a little better.

Scootertaj

03-02-2005, 01:06 AM

VLINK="#FFFFFF"
</vlink>
<v align="right">

Never heard of these, as rmedek says <v align="right"> isn't a tag, are the others?

_Aerospace_Eng_

03-02-2005, 01:08 AM

VLINK="#FFFFFF" is a real tag but its deprecated the its the equivalent of a:visited in css

rmedek

03-02-2005, 01:14 AM

VLINK="#FFFFFF" is a real tag but its deprecated the its the equivalent of a:visited in css
It's not a tag, it's an attribute. So it could be used in the body tag (<body vlink="#333">) but there wouldn't be a closing tag (such as </vlink>).

Wolfmans55

03-02-2005, 01:19 AM

The alignment was all off when I added more text to a table so I decided to give each table a position: abosolute and that did the trick just had to re-do some margins. Thanks guys. <v align> was an attempt for a vertical align? lol I had no idea what to do.

rmedek

03-02-2005, 01:22 AM

:D it's ok.

When in doubt...

http://www.w3schools.com/css/css_reference.asp

_Aerospace_Eng_

03-02-2005, 01:50 AM

oops its been a long day, been working on my site, helping others, i got tags and attributes flying everywhere :eek: