javascript圆盘抽奖程序实现原理和完整代码例子(2)


<input type="button" value="抽奖" />
<input type="button" value="再抽一次" />
m$('test').onclick = function () {
                m$('test').style.display = "none";
                showMsg();
            }

m$('restart').onclick = function () {
                m$('restart').style.display = "none";

if (isIE) {
                    m$("demo").style.top = "0px";
                    m$("demo").style.left = "0px";
                } else if (m$("demo").style.MozTransform !== undefined) {
                    m$("demo").style.MozTransform = 'rotate(0deg)';
                } else if (m$("demo").style.OTransform !== undefined) {
                    m$("demo").style.OTransform = 'rotate(0deg)';

} else if (m$("demo").style.webkitTransform !== undefined) {
                    m$("demo").style.webkitTransform = 'rotate(0deg)';
                } else {
                    m$("demo").style.transform = 'rotate(0deg)';
                }

m$('test').style.display = "block";
                i = 0;
            }


二、完整代码demo:

复制代码 代码如下:

<!DOCTYPE html>
<html>
<head>
    <title>抽奖</title>
    <style type="text/css">
        #container{width: 400px;height: 400px;position: relative;margin: 0 auto;}
        #demo{position: absolute;filter: progid:DXImageTransform.Microsoft.Matrix(sizingmethod="auto expand");}
    </style>
</head>
<body>
    <div>
        <div>
            <img alt="" src="https://img.jbzj.com/file_images/article/201406/20146394819279.png?20145394926" />
        </div>
    </div>
    <input type="button" value="抽奖" />
    <input type="button" value="再抽一次" />
    <div>
    </div>
    <script type="text/javascript">
        var m$ = function (id) { return document.getElementById(id); }
        var ua = navigator.userAgent;
        var isIE = /msie/i.test(ua) && !window.opera;

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgpjpg.html