這篇文章主要介紹了js鼠標點擊圖片實現隨機變換圖片的方法,涉及鼠標事件與隨機函數的使用技巧,需要的朋友可以參考下
本文實例講述了js鼠標點擊圖片實現隨機變換圖片的方法。分享給大家供大家參考。具體實現方法如下：
? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 <html> <title>鼠標點擊圖片即可隨機變換圖片</title> <body bgcolor="#fef4d9" OnLoad="swapPic()"> <center> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin var rand1 = 0; var useRand = 0; images = new Array; images[1] = new Image(); images[1].src = "images/m01.jpg"; images[2] = new Image(); images[2].src = "images/m02.jpg"; images[3] = new Image(); images[3].src = "images/m03.jpg"; images[4] = new Image(); images[4].src = "images/m04.jpg"; function swapPic() { var imgnum = images.length - 1; do { var randnum = Math.random(); rand1 = Math.round((imgnum - 1) * randnum) + 1; } while (rand1 == useRand); useRand = rand1; document.randimg.src = images[useRand].src; } // End --> </script> <a onClick="swapPic();"> <img name="randimg" src="images/m09.jpg"> </a> <br> <font face="Verdana" size="-2">click image to change </center> </body> </html>希望本文所述對大家的javascript程序設計有所幫助。