[thelist] Rollover image example

Joshua Olson joshua at alphashop.net
Tue Dec 11 10:21:19 CST 2001


Try this:

    <script language="JavaScript" type="text/javascript">
      var preloaded = false;
      var preloaded_images = new Array;

      function roll_over(img, new_img)
      {
        if (document.images && preloaded)
        {
          document.images[img].src = preloaded_images[new_img].src;
        }
      }

      function load_image(src, name)
      {
        var i = new Image();
        i.src = src;
        preloaded_images[name] = i;
      }

      function preload_images()
      {
        load_image('image1.gif', news_non_hover');
        load_image('image1_hover.gif', 'news_hover');
        preloaded = true;
      }
    </script>

Add this to the body tag
  <body onload="preload_images();">

And, an example link:

<a href="/news/" onmouseover="roll_over('news_img', 'news_hover');"
onmouseout="roll_over('news_img', 'news_non_hover');"><img
src="my_image.gif" name="news_img" id="news_img" width="157" height="25"
alt="" border="0"></a>

Will this work for you?

-joshua

----- Original Message -----
From: "Diego Lafuente" <diego at minid.net>
Subject: [thelist] Rollover image example


: I need a practical, clean and compatible rollever script i can use...





More information about the thelist mailing list