js鼠標(biāo)點(diǎn)擊圖片實(shí)現(xiàn)隨機(jī)變換圖片的方法
更新時(shí)間：2015年02月16日 09:53:38 作者：代碼家園
這篇文章主要介紹了js鼠標(biāo)點(diǎn)擊圖片實(shí)現(xiàn)隨機(jī)變換圖片的方法,涉及鼠標(biāo)事件與隨機(jī)函數(shù)的使用技巧,需要的朋友可以參考下
本文實(shí)例講述了js鼠標(biāo)點(diǎn)擊圖片實(shí)現(xiàn)隨機(jī)變換圖片的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下：
<html>
<title>鼠標(biāo)點(diǎn)擊圖片即可隨機(jī)變換圖片</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>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript之iterable_動(dòng)力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要介紹了JavaScript之iterable，遍歷Array可以采用下標(biāo)循環(huán)，遍歷Map和Set就無(wú)法使用下標(biāo)。為了統(tǒng)一集合類(lèi)型，ES6標(biāo)準(zhǔn)引入了新的iterable類(lèi)型，Array、Map和Set都屬于iterable類(lèi)型2017-06-06
這篇文章主要介紹了javascript禁止超鏈接跳轉(zhuǎn)的方法,結(jié)合實(shí)例分析了JavaScript事件機(jī)制與鼠標(biāo)事件的響應(yīng)操作技巧,需要的朋友可以參考下2016-02-02
這篇文章主要介紹了微信小程序版本自動(dòng)更新的方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-06-06
js中對(duì)函數(shù)設(shè)置默認(rèn)參數(shù)值的3種方法
這篇文章主要介紹了js中對(duì)函數(shù)設(shè)置默認(rèn)參數(shù)值的3種方法嗎，3種方法都具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2015-10-10
Javascript中call，apply，bind方法的詳解與總結(jié)
本文主要Javascript中call，apply，bind方法的進(jìn)行全面分析，并在文章結(jié)尾對(duì)call，apply，bind方法的聯(lián)系和區(qū)別做了總結(jié)，具有很好的參考價(jià)值，需要的朋友一起來(lái)看下吧2016-12-12
本文主要給大家簡(jiǎn)單介紹了是什么是DOM、動(dòng)態(tài)操作DOM元素的方法、使用jsjs操作樣式以及Form對(duì)象的簡(jiǎn)介，是個(gè)人對(duì)于javascript中的DOM的理解的總結(jié)，推薦給小伙伴們。2015-03-03
解析從小程序開(kāi)發(fā)者工具源碼看原理實(shí)現(xiàn)
小程序的架構(gòu)設(shè)計(jì)與web技術(shù)還是有一定的差別，其吸取了web技術(shù)的一些優(yōu)勢(shì)，同時(shí)也摒棄web技術(shù)中體驗(yàn)等不好的地方。下面通過(guò)問(wèn)題的形式來(lái)說(shuō)說(shuō)小程序架構(gòu)中的一些設(shè)計(jì)點(diǎn)2021-06-06
下面小編就為大家?guī)?lái)一篇js排序與重組的實(shí)例講解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-08-08
這篇文章主要介紹了動(dòng)態(tài)加載js文件的方法,結(jié)合實(shí)例形式簡(jiǎn)單分析了JavaScript動(dòng)態(tài)加載的實(shí)現(xiàn)技巧,需要的朋友可以參考下2016-04-04
JS實(shí)現(xiàn)仿蘋(píng)果底部任務(wù)欄菜單效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)仿蘋(píng)果底部任務(wù)欄菜單效果代碼,可實(shí)現(xiàn)鼠標(biāo)滑過(guò)顯示大圖標(biāo)功能,涉及javascript鼠標(biāo)事件及頁(yè)面元素遍歷并修改屬性的技巧,需要的朋友可以參考下2015-08-08