js實(shí)現(xiàn)網(wǎng)頁(yè)抽獎(jiǎng)實(shí)例
本文實(shí)例講述了js實(shí)現(xiàn)網(wǎng)頁(yè)抽獎(jiǎng)的方法。分享給大家供大家參考。具體如下:
這段網(wǎng)頁(yè)抽獎(jiǎng)程序,基于javascript代碼實(shí)現(xiàn),簡(jiǎn)單的演示如何使用JS來(lái)實(shí)現(xiàn)抽獎(jiǎng)功能,點(diǎn)擊“開(kāi)始抽獎(jiǎng)”按鈕,程序即開(kāi)始抽獎(jiǎng)了,需要停止的時(shí)候按“停止”,以前發(fā)過(guò)類似的抽獎(jiǎng)程序有幾個(gè)了,有興趣的自己在本站網(wǎng)頁(yè)特效欄目搜索“抽獎(jiǎng)”看下。
運(yùn)行效果如下圖所示:
具體代碼如下:
<!DOCTYPE html> <html lang="zh"> <head> <title>抽獎(jiǎng)程序</title> <script type="text/javascript"> var randNum=Math.random()*10; function testTime(){ document.getElementById("testtime").innerHTML="<h2>"+Math.floor(Math.random()*10)+"</h2>"; } function setTime(mark){ timer=null; timer=setInterval(testTime,12); if(mark=='stop'){ clearInterval(timer); } return timer; } function clearTime(timer){ } </script> <style type="text/css"> <!-- body {font-family: Arial;color:#fff;margin: 0px;padding: 0px;background:#000;text-align:center;} #happyness{font-size:186px;line-height:186px;margin-top:100px;} --> </style> </head> <body> </body> <button onClick="timer=setInterval(testTime,12);" value="" style="width:100px;height:30px">開(kāi)始抽獎(jiǎng)</button> <button onClick="clearInterval(timer);" value="Stop" style="width:100px;height:30px">停止</button> <div id="testtime" style="font-size:25px"></div> </html>
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
- js手機(jī)號(hào)批量滾動(dòng)抽獎(jiǎng)實(shí)現(xiàn)代碼
- 基于javascript實(shí)現(xiàn)簡(jiǎn)單的抽獎(jiǎng)系統(tǒng)
- javascript圓盤抽獎(jiǎng)程序?qū)崿F(xiàn)原理和完整代碼例子
- JavaScript 抽獎(jiǎng)效果實(shí)現(xiàn)代碼 數(shù)字跳動(dòng)版
- js實(shí)現(xiàn)簡(jiǎn)易的單數(shù)字隨機(jī)抽獎(jiǎng)(0-9)
- javascript+HTML5 Canvas繪制轉(zhuǎn)盤抽獎(jiǎng)
- js HTML5 Canvas繪制轉(zhuǎn)盤抽獎(jiǎng)
- js實(shí)現(xiàn)九宮格抽獎(jiǎng)
- 原生js實(shí)現(xiàn)抽獎(jiǎng)小游戲
- js實(shí)現(xiàn)隨機(jī)抽獎(jiǎng)
相關(guān)文章
JavaScript邏輯運(yùn)算符相關(guān)總結(jié)
這篇文章主要介紹了JavaScript邏輯運(yùn)算符的相關(guān)資料,幫助大家更好的理解和學(xué)習(xí)JavaScript,感興趣的朋友可以了解下2020-09-09mui開(kāi)發(fā)中獲取單選按鈕、復(fù)選框的值(實(shí)例講解)
下面小編就為大家?guī)?lái)一篇mui開(kāi)發(fā)中獲取單選按鈕、復(fù)選框的值(實(shí)例講解)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07在JavaScript中call()與apply()區(qū)別
這篇文章主要介紹了在JavaScript中call()與apply()區(qū)別 的相關(guān)資料,需要的朋友可以參考下2016-01-01使用PHP+JavaScript將HTML頁(yè)面轉(zhuǎn)換為圖片的實(shí)例分享
這篇文章主要介紹了使用PHP+JavaScript將HTML元素轉(zhuǎn)換為圖片的實(shí)例分享,文后結(jié)果的截圖只能體現(xiàn)出替換的字體,也不能說(shuō)將靜態(tài)頁(yè)面轉(zhuǎn)為圖片可以加快加載,只是這種做法比較interesting XD需要的朋友可以參考下2016-04-04使用閉包對(duì)setTimeout進(jìn)行簡(jiǎn)單封裝避免出錯(cuò)
寫(xiě)js腳本時(shí)經(jīng)常會(huì)用到一些拼寫(xiě)函數(shù)的情況,例如調(diào)用setTimeout...查了很長(zhǎng)時(shí)間,為什么就是彈不出對(duì)話框呢,使用閉包就可完全避免了2013-07-07新手快速學(xué)習(xí)JavaScript免費(fèi)教程資源匯總
這篇文章主要介紹了新手快速學(xué)習(xí)JavaScript免費(fèi)教程資源匯總,都是非常不錯(cuò)的學(xué)習(xí)站點(diǎn),有需要的小伙伴可以參考下。2015-06-06js將列表組裝成樹(shù)結(jié)構(gòu)的兩種實(shí)現(xiàn)方式分享
最近做的任務(wù)提了新的需求,需要實(shí)現(xiàn)一個(gè)樹(shù)形結(jié)構(gòu),所以下面這篇文章主要給大家介紹了關(guān)于js將列表組裝成樹(shù)結(jié)構(gòu)的兩種實(shí)現(xiàn)方式,需要的朋友可以參考下2022-01-01