HTML5+搖獎代碼使用簡單,能夠很好地實現搖獎效果,非常適合作為網站或APP的互動活動方案。
function lottery(){ var prizes = ["一等獎", "二等獎", "三等獎", "謝謝參與"]; var index = -1; var speed = 50; var timer; function roll(){ index++; if(index >= prizes.length) index = 0; var result = document.getElementById("result"); result.innerHTML = prizes[index]; timer = setTimeout(roll, speed); } function stop(){ clearTimeout(timer); } roll(); setTimeout(function(){ stop(); }, 3000); }
以上代碼是一個簡單的搖獎函數,將獎項內容存入數組中,通過隨機取出數組元素實現隨機抽獎效果。同時,可以設置滾動速度和停止時間,增強互動體驗。
在HTML頁面中,只需要調用該函數并設置一個按鈕即可實現搖獎功能:
<button onclick="lottery()">抽獎</button> <p id="result"></p>
以上示例代碼僅為簡單示例,實際應用時可以進行更多的自定義設置。除了搖獎之外,HTML5+還提供了多種互動功能及動畫效果,具有廣泛的應用前景。