#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2002
    Location
    Location! Location!
    Posts
    2
    Rep Power
    0

    Image Swapping through CSS?


    I've seen it done before but im not sure how. Is there a CSS alternative to the javascript mouseover?
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Nov 2001
    Posts
    1,882
    Rep Power
    20
    Where have you see it done?

    You need the Javascript code to make the mouseover function.
    You may have seen a page that incorporates CSS into the design.
  4. #3
  5. No Profile Picture
    Senior Citizen
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2001
    Location
    leftcoast
    Posts
    2,019
    Rep Power
    16
    Yup.

    <html>
    <head>
    <title>untitled</title>
    <script type="text/javascript" language="javascript">

    //preload - for quick display
    var x = new Image();
    x.src = 'http&#58;//thumb-2.image.altavista.com/image/238889524';

    </script>
    <style type="text/css">

    .roll {
    width: 131px;
    height: 131px;
    border: 8px salmon ridge;
    cursor: default;
    background: url(http&#58;//thumb-1.image.altavista.com/image/16411627);
    }

    a:hover.roll {
    background: url(http&#58;//thumb-2.image.altavista.com/image/238889524);
    }

    </style>
    </head>
    <body>
    <a class="roll" href="#"
    onmouseover="status=defaultStatus;return true;"
    onclick="return false;"></a>
    </body>
    </html>
    Last edited by adios; August 30th, 2002 at 07:28 PM.

IMN logo majestic logo threadwatch logo seochat tools logo