jquery实现一个大转盘抽奖效果代码-html代码-BFW代码库

jquery实现一个大转盘抽奖效果代码

代码语言：html

所属分类：大转盘

代码描述：jquery实现一个大转盘抽奖效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <style>
        html, body, div, span, applet, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        b, u, i, center,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td,
        article, aside, canvas, details, embed,
        figure, figcaption, footer, header, hgroup,
        menu, nav, output, ruby, section, summary,
        time, mark, audio, video {
            margin: 0;
            padding: 0;
            border: 0;
            font: inherit;
            font-size: 100%;
            vertical-align: baseline;
        }

        html {
            line-height: 1;
        }

        ol, ul {
            list-style: none;
        }

        table {
            border-collapse: collapse;
            border-spacing: 0;
        }

        caption, th, td {
            text-align: left;
            font-weight: normal;
            vertical-align: middle;
        }

        q, blockquote {
            quotes: none;
        }
        q:before, q:after, blockquote:before, blockquote:after {
            content: "";
            content: none;
        }

        a img {
            border: none;
        }

        article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
            display: block;
        }

        .turntable-bg {
            width: 650px;
            height: 600px;
            margin: 0 auto;
            position: relative;
            border: 1px solid #f00;
            background: url("//repo.bfw.wiki/bfwrepo/images/huodong/turntable-bg.jpg");
        }
        .turntable-bg .mask {
            width: 454px;
            height: 451px;
            position: absolute;
            left: 116px;
            top: 60px;
            /*z-index:9;*/
        }
        .turntable-bg .pointer {
            width: 174px;
            height: 228px;
            position: absolute;
            left: 50%;
            top: 50%;
            margin-left: -67px;
            margin-top: -144px;
            z-index: 8;
        }
        .turntable-bg .rotate {
            width: 450px;
            height: 450px;
            position: absolute;
            left: 116px;
            top: 60px;
        }

    </style>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.17.js"></script>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/awardRotate.min.js"></script>

    <script>

        $(function () {

            var rotateTimeOut = function () {

                $('#rotate').rotate({

                    angle: 0,

                    animateTo: 2160,

                    duration: 8000,

                    callback: function () {

                        alert('网络超时，请检查您的网络设置！');

  .........完整代码请登录后点击上方下载按钮下载查看