Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 9 of 9
  1. #1
    Member dima777's Avatar
    Join Date
    Jun 2005
    Posts
    35
    Member #
    10309
    Hello friends!!!

    I am attaching a sample table made by me yesterday of a table with the rolover effect using the .hover technique....This table works in Opera and not in IE..

    I will be very much thankfull if you could help me determine why this is so

    Dima

  2.  

  3. #2
    Senior Member Stylise's Avatar
    Join Date
    Jul 2005
    Location
    Mount Martha, Australia
    Posts
    229
    Member #
    10679
    IE and Opera do not support the :hover pseudo-class on anything but hyperlinks, you'll have to use js.

  4. #3
    Member dima777's Avatar
    Join Date
    Jun 2005
    Posts
    35
    Member #
    10309
    ohhhhhhhhhhhhhhhhhhhhh...thank you for the info....how do i make the cells rollover for the table ????? I want it so much!!!) I am afraid of using the javascript cos this way the links might not be visible to the search engine spiders....please help!!!!

  5. #4
    Member dima777's Avatar
    Join Date
    Jun 2005
    Posts
    35
    Member #
    10309
    does this mean that the entries in the table should be LINKs for the effect to work ??? if that is the case....they will be links in their own time....cos i will populate my table with links at the later stage.......you comments are hugely appreciated!!!!!

  6. #5
    Senior Member Stylise's Avatar
    Join Date
    Jul 2005
    Location
    Mount Martha, Australia
    Posts
    229
    Member #
    10679
    What you can do is:

    HTML Code:
    <div class="links">
        <a href="">Service</a>
        <a href="">About Us </a>
        <a href="">Company</a>
        <a href="">Partners</a>
        <a href="">Products</a>
    </div>
    CSS
    HTML Code:
    .links {
        margin: 0px;
        width: 44%;
    }
    
    .links a:link, .links a:visited, .links a:active {
        font: 10pt Verdana, Arial, Helvetica, sans-serif;
        height: 20px;
        color: #FFF;
    } 
    
    .links a:hover {
        background-color: #FF0000;
    }

  7. #6
    Member dima777's Avatar
    Join Date
    Jun 2005
    Posts
    35
    Member #
    10309
    thank you !!! i will update the thread after i have tested you code...

  8. #7
    Senior Member Stylise's Avatar
    Join Date
    Jul 2005
    Location
    Mount Martha, Australia
    Posts
    229
    Member #
    10679
    I just quickly tried it myself, and it need a little fixing, try this instead:

    HTML Code:
    .links {
        margin: 0px 0px 0px 20px;
        width: 43%;
    }
    
    .links a {
    	margin: 0px 0px 4px 0px;
    	padding: 20px 0px 0px 0px;
        font: 10pt Verdana, Arial, Helvetica, sans-serif;
        height: 40px;
        color: #FFF;
    	display: block;
    	background-color: #000;
    } 
    
    .links a:hover {
        background-color: #FF0000;
    }

  9. #8
    Member dima777's Avatar
    Join Date
    Jun 2005
    Posts
    35
    Member #
    10309
    Hello!

    I placed the code you supplied into the html page.I attach it for your review. The div links are invisible nd can be highlighted but the table items are not ( Please help me....

    To clarify the effect I was going to achieve please visit this page for example:

    http://www.entheosweb.com/website_de...ble_tricks.asp

    Their table effect works in both browsers....

    Thanks!!!!

  10. #9
    Senior Member Stylise's Avatar
    Join Date
    Jul 2005
    Location
    Mount Martha, Australia
    Posts
    229
    Member #
    10679
    Check the code I put up in my last post. It should do the trick!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 02:46 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com