📄 page7.htm

📁 javascript的学习文章
💻 HTM
字号:
<html>

<head>

<title>image swap and preload demo</title>

<style>

body {font-family: sans-serif}

</style>



<script>



function WM_preloadImages() {



/*

WM_preloadImages()

Loads images into the browser's cache for later use.



Source: Webmonkey Code Library

(http://www.hotwired.com/webmonkey/javascript/code_library/)



Author: Nadav Savio

Author Email: nadav@wired.com



Usage: WM_preloadImages('image 1 URL', 'image 2 URL', 'image 3 URL', ...);

*/



  // Don't bother if there's no document.images

  if (document.images) {

    if (typeof document.WM == 'undefined'){

      document.WM = new Object();

    }

    document.WM.loadedImages = new Array();

    // Loop through all the arguments.

    var argLength = WM_preloadImages.arguments.length;

    for(arg=0;arg<argLength;arg++) {

      // For each arg, create a new image.

      document.WM.loadedImages[arg] = new Image();

      // Then set the source of that image to the current argument.

      document.WM.loadedImages[arg].src = WM_preloadImages.arguments[arg];

    }

  }

}





// preload the image to be swapped:



WM_preloadImages('http://a1112.g.akamai.net/7/1112/492/02012000/static.wired.com/webmonkey/99/30/stuff1a/bloodymonkey.gif');





function WM_imageSwap(daImage, daSrc){

  var objStr,obj;

  /*

    WM_imageSwap()

    Changes the source of an image.



    Source: Webmonkey Code Library

    (http://www.hotwired.com/webmonkey/javascript/code_library/)



    Author: Shvatz

    Author Email: shvatz@wired.com



    Usage: WM_imageSwap(originalImage, 'newSourceUrl');



    Requires: WM_preloadImages() (optional, but recommended)

    Thanks to Ken Sundermeyer (ksundermeyer@macromedia.com) for his help

    with variables in ie3 for the mac. 

    */



  // Check to make sure that images are supported in the DOM.

  if(document.images){

    // Check to see whether you are using a name, number, or object

    if (typeof daImage == 'string') {

      // This whole objStr nonesense is here solely to gain compatability

      // with ie3 for the mac.

      objStr = 'document.' + daImage;

      obj = eval(objStr);

      obj.src = daSrc;

    } else if ((typeof daImage == 'object') && daImage && daImage.src) {

      daImage.src = daSrc;

    }

  }

}





</script>

</head>



<body bgcolor="#ffffff">



<center>





<p><br><br>
    <b><font color="#ff0000">把你的鼠标放在图像上，你会看到：当该猴子喝醉时，它会怎么样。</font><br>

<br>

<a href="#" onmouseover="WM_imageSwap('daImage','http://a1112.g.akamai.net/7/1112/492/02012000/static.wired.com/webmonkey/99/30/stuff1a/bloodymonkey.gif');" onmouseout="WM_imageSwap('daImage','http://a1112.g.akamai.net/7/1112/492/02012000/static.wired.com/webmonkey/99/30/stuff1a/partymonkey.gif');"><img name="daImage" src="http://a1112.g.akamai.net/7/1112/492/02012000/static.wired.com/webmonkey/99/30/stuff1a/partymonkey.gif" border=0></a></b>





<p><br><font size="2">为了知道它是如何做的，请你去看源代码 （如果你不知道什么是源代码，请你去看 <a href=http://hotwired.lycos.com/webmonkey/html/viewsource.html>如何查看源代码</a>).</font>



</center>



</body>

</html>
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -