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 5 of 5
  1. #1
    Regular Coder Bengal313's Avatar
    Join Date
    Jun 2002
    Location
    Metro Detroit
    Posts
    298
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Cell Border and BG change

    I have a simple request for some HTML help. I have a html page that has the navigation bar on the left hand side. All the links are basically hyperlink text in cells enclosed by a table. The table has no borders and a white background. Now what i need to do is when some hovers over a link I would like for the following things to happen.

    1. Have the link change from Blue to Red
    2. Have the background of the cell that the link is enclosed to change from White to Grey
    3. Have the border of the cell to go from no-border to having a border.

    I guess it would be easy to just create two seperate images for each link and use JS for hover over effect. I just don't want to create all those images for all the links. I figure this would be alot easier and faster.
    "Knowledge Speaks But Wisdom Listens"

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,646
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Try:

    <style type="text/css">
    a:link, a:active, a:visited {color:blue; background-color:white;border:none}
    a:hover {color:red; background-color:grey;border:1 green solid}
    </style>
    </head>
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">

  • #3
    New Coder
    Join Date
    Oct 2002
    Location
    California
    Posts
    98
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Hey Zoobie, does that make only the background of the text change, or the whole cell? Is there one for making the whole cell BG color change?

  • #4
    Senior Coder
    Join Date
    Jun 2002
    Location
    The Netherlands, Baarn, Ut.
    Posts
    4,252
    Thanks
    0
    Thanked 0 Times in 0 Posts

    display: block

    When the display property of the a element in question is set to block, it should span the whole table cell, and therefore in fact change the entire background of it. I've understood there are issues with the width property; read this article on ALA about it, there's also more interesting info on links there: CSS Design: Taming lists.
    Regards,
    Ronald.
    ronaldvanderwijden.com

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    ColoRockyz
    Posts
    1,646
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Well, the cell kinda shrink-wraps to the text so the text's background looks like the cells. Otherwise, you could do a background image swap mouseover with javascript but then we're back to square 1...
    Last edited by zoobie; 01-09-2003 at 05:51 AM.
    Zoobie or not Zoobie...That is the problem.
    <body onUnload="flush( ! )">


  •  

    Posting Permissions

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