Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11

Thread: Rollover Text

  1. #1
    New Coder
    Join Date
    Mar 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Rollover Text

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

  • #2
    Daf
    Daf is offline
    Regular Coder
    Join Date
    Feb 2005
    Location
    East Texas
    Posts
    140
    Thanks
    32
    Thanked 2 Times in 2 Posts
    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

  • #3
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    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.

  • #4
    New Coder
    Join Date
    Mar 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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?



    Code:
    <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>

  • #5
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    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.

  • #6
    Regular Coder
    Join Date
    Sep 2004
    Posts
    347
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Code:
    VLINK="#FFFFFF"
    </vlink>
    <v align="right">
    Never heard of these, as rmedek says <v align="right"> isn't a tag, are the others?

  • #7
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    VLINK="#FFFFFF" is a real tag but its deprecated the its the equivalent of a:visited in css

  • #8
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts
    Quote Originally Posted by _Aerospace_Eng_
    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>).

  • #9
    New Coder
    Join Date
    Mar 2005
    Posts
    29
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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.

  • #10
    Senior Coder
    Join Date
    Nov 2003
    Location
    Minneapolis, MN
    Posts
    2,879
    Thanks
    2
    Thanked 65 Times in 56 Posts

  • #11
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    oops its been a long day, been working on my site, helping others, i got tags and attributes flying everywhere


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •