这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
分享一个最近模仿市面彩票系统写个小案例,没有使用任何后台,从投注到开奖再到返奖都是用原生 JS 实现的。
个人游戏之作,小伙伴们研究下就好
主要功能:
1、可自由选择投注模式、倍数,可点击'×'删除提交注单。 2、可使用 jsonp 引用官方彩票开奖数据(实时开奖)。 3、结合后台可实现官彩同样的效果。
实现原理:
单纯使用 Js 实现,这里主要用数组存放数据,随机生成开奖号码,然后进行判断是否中奖。
下面是完整 JS 代码:
index.html
- <!doctype html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta name="Generator" content="EditPlus®">
- <meta name="Author" content="">
- <meta name="Keywords" content="">
- <meta name="Description" content="">
- <title>
- 彩票--德芙
- </title>
- <link rel="stylesheet" type='text/css' href="css/index.css" />
- <script type="text/javascript" src='js/sports-1.0-js.js'>
- </script>
- </head>
- <body>
- <div id='Game'>
- <div class='G_top'>
- <div class="G_t_title">
- <h1 class='G_t_t_logo'>
- TanZhouCaiPiao
- </h1>
- <p class='text'>
- 付出不亚于任何人的努力!
- </p>
- </div>
- <div class='G_t_kaijiang'>
- <p class='G_t_k_title'>
- 潭州彩票
- <span class='G_t_k_t_issue' id='G_t_k_t_issue'>
- </span>
- 期
- </p>
- <div class='G_t_k_num' id='G_t_k_num'>
- <span>
- </span>
- <span>
- </span>
- <span>
- </span>
- <span>
- </span>
- <span>
- </span>
- </div>
- </div>
- <div class="G_t_user">
- <div class='G_t_u_name'>
- 德芙纵享丝滑
- </div>
- <div class='G_t_u_buy'>
- ¥
- <span class='G_t_u_money' id='G_t_u_money'>
- 1314.51
- </span>
- </div>
- <div class='supMoney' id='supMoney'>
- </div>
- <div class='addMoney' id='addMoney'>
- </div>
- </div>
- </div>
- <div id="content">
- <div class='c_left'>
- <div class='c_l_mode' id='c_l_mode'>
- <span class='c_l_m_first'>
- 三星
- </span>
- <span>
- 定位胆
- </span>
- <span>
- 大小单双
- </span>
- </div>
- <div class="c_l_shuoming">
- <div class="c_l_s_right" id='c_l_s_right'>
- <a href="javascript:void(0)">
- 选号规则
- <div class='c_l_s_r_hide'>
- </div>
- </a>
- <a href="javascript:void(0)">
- 中奖说明
- <div class='c_l_s_r_hide'>
- </div>
- </a>
- <a href="javascript:void(0)">
- 投注案例
- <div class='c_l_s_r_hide'>
- </div>
- </a>
- </div>
- </div>
- <div class='c_l_number' id='c_l_number'>
- </div>
- <div class='c_l_bottom'>
- <div class='c_l_b_function'>
- <span class="c_l_b_f_sup">
- </span>
- <input type="text" class='c_l_b_f_beishu' id='c_l_b_f_beishu' value='1'
- />
- <span class="c_l_b_f_add">
- </span>
- <i>
- 倍
- </i>
- <select name="sel_mode" id="sel_mode" class="c_l_b_f_sel">
- <option value="1">
- 元
- </option>
- <option value="2">
- 角
- </option>
- <option value="3">
- 分
- </option>
- </select>
- <p class='c_l_b_f_jiangjin'>
- 奖金:
- <span id='jiangjin'>
- 1800
- </span>
- </p>
- <p class="c_l_b_f_data">
- 选择
- <span class='c_l_b_f_d_num' id='zhushu'>
- 0
- </span>
- 注,共 ¥
- <span class='c_l_b_f_d_num' id='money'>
- 0
- </span>
- 元
- </p>
- </div>
- <div class='c_l_b_submit'>
- <input type="submit" value='添加号码' id='c_l_b_s_addNum' />
- </div>
- <input type="button" value='提交注单' id='c_l_b_deledNum' class='c_l_b_deledNum'
- />
- </div>
- <textarea id='c_l_data' class='c_l_data' readonly>
- </textarea>
- </div>
- <div class='c_right'>
- <div class="c_r_rus">
- <div class="c_r_r_qihao">
- 开奖期号
- </div>
- <div class="c_r_r_haoma">
- 开奖号码
- </div>
- <ul id='c_r_r_box'>
- </ul>
- </table>
- </div>
- <div class="c_r_list">
- <div class="c_r_l_title">
- <span>
- 玩法
- </span>
- <span>
- 注数
- </span>
- <span>
- 倍数
- </span>
- <span>
- 金额
- </span>
- <span class='close'>
- </span>
- </div>
- <ul id='c_r_l_ul'>
- </ul>
- </div>
- <div class="c_r_touzhu">
- <input type="button" value='立即投注' id='c_r_t_btn' class='c_r_t_btn' />
- </div>
- </div>
- </div>
- </div>
- <div class='explain'>
- <h2>
- 介绍说明
- </h2>
- <div id='toggleMove' class='arrow'>
- </div>
- <p>
- <span>
- 投注方式:
- </span>
- 请您选择您的投注号码后'添加号码'==>'提交注单'==>'立即投注'
- </p>
- <p>
- <span>
- 三星玩法:
- </span>
- 至少需要在'百位'、'十位'、'个位'三个位置中选择一个号码投注,开奖号码后三位与您投注号码一致即中奖
- </p>
- <p>
- <span>
- 定位胆玩法:
- </span>
- 从任意一个位置选择一个号码即可投注,开奖号码与投注号码的位置、号码相同即中奖
- </p>
- <p>
- <span>
- 大小单双玩法:
- </span>
- 至少需要在'百位'、'十位'中选择一个号码投注,开奖号码与投注号码的位置、形态相同即中奖
- </p>
- <p>
- <span>
- 功能:
- </span>
- 可自由选择投注模式、倍数,可点击'×'删除提交注单
- </p>
- <p>
- <span>
- 扩展:
- </span>
- 可使用jsonp引用官方彩票开奖数据(实时开奖),更多玩法添加请联系我
- </p>
- <p>
- <span>
- Author:
- </span>
- Thompson德芙
- </p>
- <p>
- <span>
- 转载:
- </span>
- </p>
- </div>
- <script type="text/javascript" src='js/index.js'>
- </script>
- </body>
- </html>
index.css
- @charset = "UTF-8";
- html,
- body,
- ul,
- li,
- a,
- i,
- div,
- img,
- span,
- p {
- margin: 0;
- padding: 0;
- }
- ul,
- li {
- list - style: none;
- }
- a {
- text - decoration: none;
- }
- i {
- font - style: normal;
- }
- body {
- background: url('../img/bg.jpg');
- font - family: 'Microsoft yahei';
- }.clearfix: after {
- visibility: hidden;
- display: block;
- font - size: 0;
- content: " ";
- clear: both;
- height: 0;
- }.explain {
- height: 242px;
- position: absolute;
- top: -242px;
- right: 10 % ;
- background: rgba(0, 0, 0, 0.5);
- border - radius: 5px;
- font - size: 12px;
- padding: 10px;
- margin: 0 auto;
- color: #fff;
- }#toggleMove {
- height: 20px;
- width: 100 % ;
- text - align: center;
- position: absolute;
- cursor: pointer;
- transform: scale(1.5);
- }.arrow {
- background: url(.. / img / arrow.png) no - repeat center 0;
- bottom: 0;
- }.close {
- background: url(.. / img / arrow.png) no - repeat center - 40px;
- bottom: -18px;
- }.explain h2 {
- text - align: center;
- }.explain p {
- margin: 5px;
- }.explain p span {
- color: #ffff33;
- margin - right: 10px;
- }#Game {
- width: 1000px;
- height: 500px;
- margin: 50px auto 200px;
- }#Game.G_top {
- width: 100 % ;
- height: 120px;
- position: relative;
- }#Game.G_top.G_t_title {
- width: 600px;
- height: 120px;
- position: absolute;
- top: 0;
- left: 0;
- }#Game.G_top.G_t_title.text {
- width: 100 % ;
- position: absolute;
- left: 0;
- bottom: 0;
- font - size: 24px;
- color: #fff;
- font - weight: bold;
- text - shadow: 0 0 1px currentColor,
- 1px 1px 1px rgba(50, 93, 164, 0.8),
- 2px 2px 3px rgba(50, 93, 164, 0.8),
- 3px 3px 4px rgba(50, 93, 164, 0.8),
- 4px 4px 5px rgba(50, 93, 164, 0.8);
- }#Game.G_top.G_t_title.G_t_t_logo {
- width: 100 % ;
- height: 100px;
- font - size: 50px;
- font - weight: bold;
- color: rgba(41, 76, 138, 0.8);
- margin: 0;
- letter - spacing: 6px;
- text - shadow: 0 0 1px currentColor,
- 2px 0 1px#083058,
- 0 2px 1px rgba(41, 76, 138, 0.8),
- 2px 1px 1px#083058,
- 1px 2px 1px#98c0e8,
- 2px 2px 1px#487098,
- 3px 1px 1px#083058,
- 1px 3px 1px rgba(41, 76, 138, 0.8),
- 3px 2px 1px#083058,
- 2px 3px 1px rgba(41, 76, 138, 0.8),
- 3px 3px 1px#487098,
- 4px 2px 1px#083058,
- 2px 4px 1px rgba(41, 76, 138, 0.8),
- 4px 3px 1px#083058,
- 3px 4px 1px rgba(41, 76, 138, 0.8),
- 4px 4px 1px#487098,
- 5px 3px 1px#083058,
- 3px 5px 1px#98c0e8,
- 5px 4px 1px#083058,
- 4px 5px 1px rgba(41, 76, 138, 0.8),
- 5px 5px 1px#487098,
- 6px 4px 1px#083058,
- 4px 6px 1px rgba(41, 76, 138, 0.8),
- 6px 5px 1px#083058,
- 5px 6px 1px rgba(41, 76, 138, 0.8),
- 6px 6px 1px#487098,
- 7px 5px 1px#083058,
- 5px 7px 1px#98c0e8,
- 7px 6px 1px#083058,
- 6px 7px 1px#98c0e8,
- 7px 7px 1px#487098,
- 8px 6px 1px#083058,
- 6px 8px 1px#98c0e8,
- 8px 7px 1px#083058,
- 7px 8px 1px#98c0e8,
- 8px 8px 1px#487098,
- 9px 7px 1px#083058,
- 7px 9px 1px#98c0e8,
- 9px 8px 1px#083058,
- 8px 9px 1px#98c0e8,
- 9px 9px 1px#487098,
- 10px 8px 1px#083058,
- 8px 10px 1px#98c0e8,
- 10px 9px 1px#083058,
- 9px 10px 1px#98c0e8,
- 10px 10px 1px#487098,
- 11px 9px 1px#083058,
- 9px 11px 1px#98c0e8,
- 11px 10px 1px#083058,
- 10px 11px 1px#98c0e8,
- 11px 11px 1px#487098,
- 11px 11px 1px#666,
- 11px 12px 1px#666,
- 10px 12px 1px#666,
- 9px 12px 1px#666,
- 8px 11px 1px#666,
- 7px 10px 1px#666,
- 6px 9px 1px#666,
- 5px 8px 1px#666,
- 4px 7px 1px#666,
- 3px 6px 1px#666,
- 2px 5px 1px#666,
- 1px 4px 1px#666,
- 0 3px 1px#666,
- -1px 2px 1px#666,
- 20px 8px 8px rgba(0, 0, 0, .7);
- }
- h1: before,
- h1: after {
- content: 'TanZhouCaiPiao';
- position: absolute;
- top: 0;
- left: 0;
- right: 0;
- color: rgba(41, 76, 138, 0.8);
- text - shadow: 0 0 1px currentColor,
- -1px - 1px 1px#003,
- 0 - 1px 1px#003,
- 1px - 1px 1px#003,
- 1px 0 1px#003,
- 1px 1px 1px#003,
- 0 1px 1px#003,
- -1px 1px 1px#003,
- -1px 0 1px#003;
- }
- h1: after {
- color: rgba(40, 80, 120, .1);
- text - shadow: 1px - 1px 1px rgba(40, 80, 120, .8),
- -1px 1px 1px rgba(255, 255, 255, .8);
- }#Game.G_top.G_t_kaijiang {
- width: 360px;
- height: 110px;
- background: rgba(41, 76, 138, 0.8);
- padding: 5px;
- position: absolute;
- right: 0;
- top: 0;
- }#Game.G_top.G_t_kaijiang.G_t_k_title {
- width: 360px;
- line - height: 20px;
- background: rgba(51, 51, 51, 0.8);
- color: #fff;
- font - size: 14px;
- text - align: center;
- }#Game.G_top.G_t_kaijiang.G_t_k_title.G_t_k_t_issue {
- margin: 0 5px;
- color: #399;
- }#Game.G_top.G_t_kaijiang.G_t_k_num {
- width: 100 % ;
- height: 90px;
- }#Game.G_top.G_t_kaijiang.G_t_k_num span {
- display: block;
- width: 59px;
- height: 57px;
- margin - left: 11px;
- margin - top: 16px;
- float: left;
- background: url('../img/num.png') - 423px - 119px;
- }#Game.G_top.G_t_kaijiang.G_t_k_num span.kaijiang {
- background: url('../img/mv.gif');
- background - position: '0px 0px';
- }#Game.G_top.G_t_user {
- width: 240px;
- height: 40px;
- position: absolute;
- bottom: -20px;
- left: 350px;
- }#Game.G_top.G_t_user.supMoney,
- #Game.G_top.G_t_user.addMoney {
- width: 140px;
- height: 40px;
- position: absolute;
- top: 0px;
- right: -80px;
- font - weight: bold;
- font - size: 24px;
- color: #ff6700;
- opacity: 1;
- }#Game.G_top.G_t_user.addMoney {
- color: #00ff66;
- }#Game.G_top.G_t_user > div {
- width: 100px;
- line - height: 40px;
- text - align: center;
- float: left;
- color: #fff;
- }#Game.G_top.G_t_user.G_t_u_buy {
- color: #ff0;
- }#Game.G_top.G_t_user.G_t_u_buy.G_t_u_money {
- color: #ff6700;
- }#content {
- width: 100 % ;
- height: 350px;
- margin - top: 30px;
- }#content.c_left {
- width: 680px;
- height: 100 % ;
- float: left;
- position: relative;
- }#content.c_left.c_l_mode {
- width: 672px;
- height: 38px;
- padding: 3px;
- background: rgba(0, 0, 0, 0.8);
- border - radius: 5px;
- }#content.c_left.c_l_mode > span {
- width: 70px;
- height: 34px;
- display: block;
- float: left;
- font - family: 14px;
- text - align: center;
- line - height: 34px;
- margin: 2px 10px 2px 0px;
- background: rgb(78, 70, 63);
- border - radius: 5px;
- color: #fff;
- cursor: pointer;
- transition: 0.3s; - moz - transition: 0.3s; - webkit - transition: 0.3s; - o - transition: 0.3s; - ms - transition: 0.3s;
- }#content.c_left span.c_l_m_first {
- background: rgba(31, 58, 110, 1);
- }#content.c_left.c_l_mode > span: hover {
- background: rgba(31, 58, 110, 1);
- }#content.c_left.c_l_shuoming {
- margin - top: 10px;
- width: 100 % ;
- height: 44px;
- background: rgba(0, 0, 0, 0.8);
- border - radius: 5px;
- }#content.c_left.c_l_shuoming.c_l_s_right {
- width: 260px;
- height: 20px;
- float: right;
- margin: 11px 10px 11px 0px;
- }#content.c_left.c_l_shuoming.c_l_s_right > a {
- display: block;
- width: 78px;
- height: 20px;
- float: left;
- line - height: 20px;
- font - size: 12px;
- color: #fff;
- text - align: center;
- margin - right: 7px;
- background: url('../img/icon.png') no - repeat;
- position: relative;
- }#content.c_left.c_l_shuoming.c_l_s_right > a.c_l_s_r_hide {
- width: 200px;
- padding: 5px;
- color: #e8e9e9;
- background: rgba(41, 76, 138, 0.8);
- position: absolute;
- right: 0px;
- top: 30px;
- border - radius: 5px;
- display: none;;
- }#content.c_left.c_l_number {
- width: 660px;
- height: 160px;
- margin - top: 20px;
- padding: 0 10px;
- }#content.c_left.c_l_number ul {
- width: 660px;
- height: 50px;
- }#content.c_left.c_l_number ul: after {
- visibility: hidden;
- display: block;
- font - size: 0;
- content: " ";
- clear: both;
- height: 0;
- }#content.c_left.c_l_number.c_l_n_align {
- color: #ffbe13;
- width: 60px;
- height: 50px;
- float: left;
- line - height: 50px;
- }#content.c_left.c_l_number ul li {
- float: left;
- width: 43px;
- height: 43px;
- border - radius: 50 % ;
- line - height: 43px;
- color: #fff;
- text - align: center;
- cursor: pointer;
- margin: 3px 5px 4px 0px;
- background: url('../img/icon.png') no - repeat - 46px - 57px;
- }#content.c_left.c_l_number.c_l_n_btn {
- margin - top: 5px;
- width: 100px;
- height: 40px;
- float: right;
- }#content.c_left.c_l_number.c_l_n_btn > span {
- display: block;
- width: 30px;
- height: 20px;
- float: left;
- color: #fff;
- font - size: 12px;
- line - height: 20px;
- text - align: center;
- background: #4a433c;
- border - radius: 3px;
- margin: 1px;
- cursor: pointer;
- transition: 0.3s; - moz - transition: 0.3s; - webkit - transition: 0.3s; - o - transition: 0.3s; - ms - transition: 0.3s;
- }#content.c_left.c_l_number.c_l_n_btn > span: hover {
- background: rgb(50, 93, 164);
- }#content.c_left.c_l_bottom {
- width: 100 % ;
- height: 34px;
- margin - top: 20px;
- position: relative;
- }#content.c_left.c_l_bottom.c_l_b_function {
- width: 540px;
- height: 34px;
- padding - left: 10px;
- background: rgba(0, 0, 0, 0.8);
- float: left;
- border - radius: 5px;
- line - height: 34px;
- color: #fff;
- font - size: 12px;
- }#content.c_left.c_l_bottom.c_l_b_function i {
- float: left;
- margin: 0 5px;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_sup {
- display: block;
- width: 16px;
- height: 16px;
- margin - top: 9px;
- background: url('../img/sub.png') no - repeat;
- float: left;
- cursor: pointer;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_beishu {
- width: 60px;
- height: 24px;
- background: #333;
- border: none;
- border - radius: 5px;
- float: left;
- margin: 5px;
- text - align: center;
- color: #ff6700;
- outline: none;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_add {
- display: block;
- width: 16px;
- height: 16px;
- margin - top: 9px;
- background: url('../img/add.png') no - repeat;
- float: left;
- cursor: pointer;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_sel {
- width: 50px;
- height: 24px;
- background: #333;
- border: none;
- border - radius: 5px;
- float: left;
- margin: 5px 20px;
- text - align: center;
- color: #ff6700;
- cursor: pointer;
- outline: none;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_jiangjin {
- width: 70px;
- height: 100 % ;
- display: inline - block;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_jiangjin span {
- color: #ff6700;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_data {
- width: 200px;
- float: right;
- }#content.c_left.c_l_bottom.c_l_b_function.c_l_b_f_data.c_l_b_f_d_num {
- margin: 0 5px;
- color: #ff6700;
- }#content.c_left.c_l_bottom.c_l_b_function: after {
- visibility: hidden;
- display: block;
- font - size: 0;
- content: " ";
- clear: both;
- height: 0;
- }#content.c_left.c_l_bottom.c_l_b_submit {
- width: 94px;
- height: 28px;
- padding: 3px;
- float: right;
- background: rgba(0, 0, 0, 0.8);
- border - radius: 5px;
- margin - right: 10px;
- }#content.c_left.c_l_bottom.c_l_b_submit > input {
- width: 94px;
- height: 28px;
- border - radius: 3px;
- font - size: 16px;
- font - family: 'Microsoft yahei';
- background: rgba(50, 93, 164, 0.8);
- border: none;
- color: #fff;
- cursor: pointer;
- }#content.c_left.c_l_bottom.c_l_b_submit > input: hover {
- background: rgba(50, 93, 164, 1);
- }#content.c_left.c_l_bottom.c_l_b_deledNum {
- position: absolute;
- bottom: -33px;
- left: 0px;
- width: 94px;
- height: 28px;
- border - radius: 3px;
- font - size: 16px;
- font - family: 'Microsoft yahei';
- background: rgba(50, 93, 164, 0.8);
- border: none;
- color: #fff;
- cursor: pointer;
- outline: none;
- }#content.c_left.c_l_bottom.c_l_b_deledNum: hover {
- background: rgba(50, 93, 164, 1);
- }#content.c_left.c_l_data {
- min - width: 660px;
- max - width: 660px;
- min - height: 115px;
- position: absolute;
- top: 370px;
- left: 0;
- border - radius: 5px;
- background: rgba(0, 0, 0, 0.8);
- border: none;
- color: #fff;
- padding: 5px 10px;
- font - size: 14px;
- font - family: 'merriweather,arial,sans-serif';
- letter - spacing: 2px;
- }
- /*right*/
- #content.c_right {
- width: 300px;
- height: 100 % ;
- float: right;
- }#content.c_right > div {
- border - radius: 5px;
- background: rgba(0, 0, 0, 0.8);
- }#content.c_right.c_r_rus {
- width: 100 % ;
- height: 185px;
- position: relative;
- }#content.c_right.c_r_rus > div {
- position: absolute;
- color: #ff6700;
- height: 30px;
- line - height: 30px;
- text - align: center;
- width: 150px;
- }#content.c_right.c_r_rus.c_r_r_qihao {
- left: 0;
- top: 0;
- }#content.c_right.c_r_rus.c_r_r_haoma {
- right: 0;
- top: 0;
- }#content.c_right.c_r_rus ul {
- width: 100 % ;
- position: absolute;
- top: 30px;
- left: 0;
- color: #fff;
- }#content.c_right.c_r_rus ul li {
- height: 30px;
- width: 100 % ;
- }#content.c_right.c_r_rus ul li span {
- display: inline - block;
- width: 150px;
- height: 30px;
- line - height: 30px;
- float: left;
- text - align: center;
- }#content.c_right.c_r_list {
- width: 280px;
- height: 150px;
- padding: 10px;
- text - align: left;
- margin: 20px auto;
- color: #fff;
- font - size: 14px;
- }#content.c_right.c_r_list.c_r_l_title {
- width: 100 % ;
- height: 30px;
- }#content.c_right.c_r_list.c_r_l_title span {
- display: inline - block;
- width: 60px;
- text - align: center;
- line - height: 20px;
- color: #ff6700;
- }#content.c_right.c_r_list ul li {
- width: 100 % ;
- height: 20px;
- }#content.c_right.c_r_list ul li span {
- display: inline - block;
- width: 60px;
- text - align: center;
- line - height: 20px;
- margin - right: 4px;
- }#content.c_right.c_r_list ul li span.list_close {
- width: 20px;
- height: 20px;
- text - align: right;
- cursor: pointer;
- color: #ff6700;
- }#content.c_right.c_r_l_title span.close {
- width: 20px;
- height: 20px;
- background - image: url('../img/icon.png');
- background - repeat: no - repeat;
- background - position: -67px - 21px;
- cursor: pointer;
- }#content.c_right.c_r_touzhu {
- margin - top: 15px;
- padding: 5px;
- color: #fff;
- text - align: center;
- }
- /*
- #content .c_right .c_r_touzhu span{
- color:#ff6700;
- }
- #content .c_right .c_r_touzhu .c_r_t_issue{
- }
- #content .c_right .c_r_touzhu .c_r_t_queren{
- font-size:14px;
- margin:15px 0;
- }*/
- #content.c_right.c_r_touzhu.c_r_t_btn {
- width: 100 % ;
- height: 50px;
- background: rgba(50, 93, 164, 0.8);
- border: none;
- border - radius: 5px;
- color: #fff;
- font - size: 26px;
- font - family: 'Microsoft yahei';
- font - weight: bold;
- cursor: pointer;
- outline: none;
- transition: 0.3s; - moz - transition: 0.3s; - webkit - transition: 0.3s; - o - transition: 0.3s; - ms - transition: 0.3s;
- }#content.c_right.c_r_touzhu.c_r_t_btn: hover {
- background: rgba(50, 93, 164, 1);
- }
index.js
- window.onload = function() {
- var toggleMove = document.getElementById('toggleMove');
- var toggleOff = true;
- Game.init();
- move(toggleMove.parentNode, {
- 'top': '0px'
- },
- '10');
- toggleMove.onclick = function() {
- if (toggleOff) {
- move(toggleMove.parentNode, {
- 'top': '-242px'
- },
- '10');
- this.className = 'close';
- toggleOff = !toggleOff;
- } else {
- move(toggleMove.parentNode, {
- 'top': '0px'
- },
- '10');
- this.className = 'arrow';
- toggleOff = !toggleOff;
- }
- }
- }
- var Game = {
- 'numPos': ['-63px -61px', '-3px -3px', '-63px -3px', '-123px -3px', '-183px -3px', '-243px -3px', '-303px -3px', '-363px -3px', '-423px -3px', '-3px -61px'],
- 'oNum': document.getElementById('c_l_number'),
- 'personMon': document.getElementById('G_t_u_money'),
- 'alignArr': ['百位', '十位', '个位'],
- 'btnArr': ['全', '大', '小', '奇', '偶', '清'],
- 'qishu': 0,
- 'step': '0',
- 'Data': [],
- 'targetData': [],
- 'OrderArr': [],
- 'num': '1',
- 'amountX': 0,
- 'wanfa': null,
- 'init': function() {
- var oMode = document.getElementById('c_l_mode').getElementsByTagName('span');
- var jiangjin = document.getElementById('jiangjin');
- this.addInitCase1();
- this.addRegulation('0');
- this.control();
- this.controlInput(Game.amountX);
- this.controlSelect(Game.num);
- this.getNumData(Game.step);
- this.empty();
- for (var i = 0; i < oMode.length; i++) {
- oMode[i].index = i;
- oMode[i].onclick = function() {
- Game.step = this.index;
- for (var j = 0; j < oMode.length; j++) {
- oMode[j].className = '';
- }
- this.className = 'c_l_m_first';
- switch (this.index) {
- case 0:
- Game.addInitCase1();
- jiangjin.innerHTML = '1800';
- break;
- case 1:
- Game.addInitCase1();
- jiangjin.innerHTML = '18';
- break;
- case 2:
- Game.addInitCase2();
- jiangjin.innerHTML = '7.8';
- break;
- }
- Game.Data.length = 0;
- Game.addRegulation(this.index);
- Game.getNumData(Game.step);
- Game.control();
- }
- }
- },
- 'addInitCase1': function() {
- this.oNum.innerHTML = '';
- for (var i = 0; i < this.alignArr.length; i++) {
- var oNum_ul = document.createElement('ul');
- var oNum_ul_div = document.createElement('div');
- oNum_ul_div.innerHTML = this.alignArr[i];
- oNum_ul_div.className = 'c_l_n_align';
- oNum_ul.appendChild(oNum_ul_div);
- for (var j = 0; j < 10; j++) {
- var oNum_ul_li = document.createElement('li');
- oNum_ul_li.off = true;
- oNum_ul_li.className = 'li' + i;
- oNum_ul_li.innerHTML = j;
- oNum_ul.appendChild(oNum_ul_li);
- }
- var oNum_ul_Rdiv = document.createElement('div');
- for (var z = 0; z < this.btnArr.length; z++) {
- var oSpan = document.createElement('span');
- oSpan.className = 'span' + i;
- oSpan.innerHTML = this.btnArr[z];
- oNum_ul_Rdiv.appendChild(oSpan);
- }
- oNum_ul_Rdiv.className = 'c_l_n_btn';
- oNum_ul.appendChild(oNum_ul_Rdiv);
- this.oNum.appendChild(oNum_ul);
- }
- },
- 'addInitCase2': function() {
- this.oNum.innerHTML = '';
- var init1Arr = ['大', '小', '单', '双'];
- for (var i = 0; i < this.alignArr.length - 1; i++) {
- var oNum_ul = document.createElement('ul');
- var oNum_ul_div = document.createElement('div');
- oNum_ul_div.innerHTML = Game.alignArr[i];
- oNum_ul_div.className = 'c_l_n_align';
- oNum_ul.appendChild(oNum_ul_div);
- for (var j = 0; j < init1Arr.length; j++) {
- var oNum_ul_li = document.createElement('li');
- oNum_ul_li.off = true;
- oNum_ul_li.className = 'li' + i;
- oNum_ul_li.innerHTML = init1Arr[j];
- oNum_ul.appendChild(oNum_ul_li);
- }
- var oNum_ul_Rdiv = document.createElement('div');
- var oSpan = document.createElement('span');
- oSpan.innerHTML = this.btnArr[5];
- oSpan.className = 'span' + i;
- oNum_ul_Rdiv.appendChild(oSpan);
- oNum_ul_Rdiv.className = 'c_l_n_btn';
- oNum_ul.appendChild(oNum_ul_Rdiv);
- this.oNum.appendChild(oNum_ul);
- }
- },
- 'addRegulation': function(step) {
- var oP = document.getElementById('c_l_s_right');
- var oHide = this.getClassName(oP, 'c_l_s_r_hide');
- var data = [['从百位、十位、个位各选一个号码组成一注。', '从百位、十位、个位中选择一个3位数号码组成一注,所选号码与开奖号码后3位相同,且顺序一致,即为中奖。', '投注方案:345</br>开奖号码:345,即中后三直选。'], ['在百位、十位、个位任意位置上任意选择1个或1个以上号码。', '从百位、十位、个位任意位置上至少选择1个以上号码,所选号码与相同位置上的开奖号码一致,即为中奖。', '投注方案:百位 1</br>开奖号码:百位 1,即中定位胆百位。'], ['从百位、十位中的"大、小、单、双"中至少各选一个组成一注。', '对百位和十位的"大(56789)小(01234)、单(13579)双(02468)"形态进行购买,所选号码的位置、形态与开奖号码的位置、形态相同,即为中奖。', '投注方案:小双</br>开奖号码:百位与十位"小双",即中前二大小单双。']];
- for (var i = 0; i < oHide.length; i++) {
- oHide[i].index = i;
- oHide[i].innerHTML = data[step][i];
- oHide[i].parentNode.onmouseover = function(ev) {
- ev = ev || window.event;
- ev.preventDefault();
- for (var j = 0; j < oHide.length; j++) {
- oHide[j].style.display = 'none';
- }
- this.children[0].style.display = 'block';
- }
- }
- for (var i = 0; i < oHide.length; i++) {
- oHide[i].parentNode.onmouseout = function(ev) {
- ev = ev || window.event;
- ev.preventDefault();
- this.children[0].style.display = 'none';
- }
- }
- },
- 'getNumData': function(step) {
- var addBtn = document.getElementById('c_l_b_s_addNum');
- var oText = document.getElementById('c_l_data');
- var amount = document.getElementById('zhushu');
- var money = document.getElementById('money');
- var oInput = document.getElementById('c_l_b_f_beishu');
- var oUl = this.oNum.children;
- this.Data[step] = [];
- for (var i = 0; i < oUl.length; i++) {
- this.Data[step][i] = [];
- this.select(this.getClassName(oUl[i], 'li' + i), this.Data[step][i]);
- }
- addBtn.onclick = function() {
- oText.innerHTML = '';
- Game.Data[Game.Data.length] = step;
- Game.targetData = addNum(Game.Data);
- /**************************/
- if (Game.targetData.length) {
- switch (parseInt(step)) {
- case 0:
- Game.amountX = Game.targetData.length amount.innerHTML = Game.amountX;
- oText.innerHTML = Game.targetData;
- break;
- case 1:
- Game.amountX = Game.targetData.length;
- amount.innerHTML = Game.amountX;
- for (var i = 0; i < Game.targetData.length; i++) {
- oText.innerHTML += Game.targetData[i] + 'n';
- }
- break;
- case 2:
- Game.amountX = Game.targetData.length amount.innerHTML = Game.amountX;
- oText.innerHTML = Game.targetData;
- break;
- }
- Game.wanfa = step;
- money.innerHTML = Game.count.accMul(Game.num, Game.amountX * 2 * oInput.value);
- } else {
- money.innerHTML = '0';
- amount.innerHTML = '0';
- alert('请选择正确的投注方式!');
- }
- /**************************/
- }
- function addNum(Data) {
- var n = parseInt(Data[Data.length - 1]);
- switch (n) {
- case 0:
- return getResultOne(Data[n]);
- break;
- case 1:
- return getResultTwo(Data[n]);
- break;
- case 2:
- return getResultThree(Data[n]);
- break;
- }
- }
- function getResultOne(Arr) {
- var newArr = [];
- if (Arr[0].length > 0 && Arr[1].length > 0 && Arr[2].length > 0) {
- for (var i = 0; i < Arr[0].length; i++) {
- for (var j = 0; j < Arr[1].length; j++) {
- for (var z = 0; z < Arr[2].length; z++) {
- newArr.push(Arr[0][i] + '' + Arr[1][j] + '' + Arr[2][z]);
- }
- }
- }
- newArr.sort(function(a, b) {
- return a - b;
- });
- return newArr;
- } else {
- return false;
- }
- }
- function getResultTwo(Arr) {
- var strArr = ['百位', '十位', '个位'];
- var newArr = [];
- for (var i = 0; i < Arr.length; i++) {
- if (Arr[i].length) {
- for (var j = 0; j < Arr[i].length; j++) {
- newArr.push(strArr[i] + ' : ' + Arr[i][j])
- }
- } else {
- continue;
- }
- }
- return newArr;
- }
- function getResultThree(Arr) {
- var newArr = [];
- if (Arr[0].length > 0 && Arr[1].length > 0) {
- for (var i = 0; i < Arr[0].length; i++) {
- for (var j = 0; j < Arr[1].length; j++) {
- newArr.push(Arr[0][i] + '' + Arr[1][j]);
- }
- }
- newArr.sort(function(a, b) {
- return a - b;
- });
- return newArr;
- } else {
- return false;
- }
- }
- },
- 'select': function(obj, arr) {
- var oText = document.getElementById('c_l_data');
- var three = ['大', '小', '单', '双'];
- for (var i = 0; i < obj.length; i++) {
- obj[i].index = i;
- obj[i].off = true;
- obj[i].onclick = function() {
- var oSpan = this.parentNode.getElementsByTagName('span');
- for (var i = 0; i < oSpan.length; i++) {
- oSpan[i].style.background = '#4a433c';
- }
- if (this.off) {
- this.style.backgroundPosition = '-2px -57px';
- arr.push(obj[this.index].innerHTML);
- this.off = !this.off;
- } else {
- this.style.backgroundPosition = '-46px -57px';
- if (arr.length) {
- for (var j = 0; j < arr.length; j++) {
- if (Game.step == 2) {
- if (arr[j] == three[this.index]) {
- arr.splice(j, 1);
- }
- } else {
- if (arr[j] == this.index) {
- arr.splice(j, 1);
- }
- }
- }
- }
- this.off = !this.off;
- }
- }
- }
- },
- 'control': function() {
- var oSpan, num;
- var controlDiv = this.getClassName(this.oNum, 'c_l_n_btn');
- for (var i = 0; i < controlDiv.length; i++) {
- controlDiv[i].index = i;
- oSpan = this.getClassName(controlDiv[i], 'span' + i);
- for (var j = 0; j < oSpan.length; j++) {
- oSpan[j].index = j oSpan[j].onclick = function() {
- num = this.parentNode.index;
- Game.Data[Game.step][num].length = 0;
- var oParent = this.parentNode.parentNode;
- var oLi = oParent.getElementsByTagName('li');
- for (var z = 0; z < oLi.length; z++) {
- oLi[z].style.backgroundPosition = '-46px -57px';
- oLi[z].off = true;
- }
- if (Game.step != 2) {
- var siblings = this.parentNode.children;
- for (var z = 0; z < siblings.length; z++) {
- siblings[z].style.background = '#4a433c';
- }
- Game.controlFn(oLi, num, this.index);
- }
- this.style.background = 'rgb(50,93,164)';
- }
- }
- }
- },
- 'controlFn': function(oLi, num, index) {
- var half = parseInt(oLi.length / 2);
- for (var i = 0; i < oLi.length; i++) {
- switch (index) {
- case 0:
- oLi[i].style.backgroundPosition = '-2px -57px';
- oLi[i].off = false;
- Game.Data[Game.step][num].push(i);
- break;
- case 1:
- if (i > half - 1) {
- oLi[i].style.backgroundPosition = '-2px -57px';
- oLi[i].off = false;
- Game.Data[Game.step][num].push(i);
- }
- break;
- case 2:
- if (i < half) {
- oLi[i].style.backgroundPosition = '-2px -57px';
- oLi[i].off = false;
- Game.Data[Game.step][num].push(i);
- }
- break;
- case 3:
- var n = (i * 2) - 1;
- if (n > 0 && n < oLi.length) {
- oLi[n].style.backgroundPosition = '-2px -57px';
- oLi[n].off = false;
- Game.Data[Game.step][num].push(n);
- }
- break;
- case 4:
- if (i * 2 < oLi.length - 1) {
- oLi[i * 2].style.backgroundPosition = '-2px -57px';
- oLi[i * 2].off = false;
- Game.Data[Game.step][num].push(i * 2);
- }
- break;
- case 5:
- oLi[i].style.backgroundPosition = '-46px -57px';
- oLi[i].off = true;
- Game.Data[Game.step][num].length = 0;
- break;
- }
- }
- },
- //倍数Input
- 'controlInput': function(amountX) {
- var money = document.getElementById('money');
- var oInput = document.getElementById('c_l_b_f_beishu');
- var oBtn = oInput.parentNode.getElementsByTagName('span');
- for (var i = 0; i < oBtn.length; i++) {
- oBtn[i].index = i;
- oBtn[i].onclick = function() {
- if (this.index) {
- if (oInput.value < 9999) {
- oInput.value++;
- }
- } else {
- if (oInput.value > 0) {
- oInput.value--;
- }
- }
- money.innerHTML = Game.count.accMul(Game.num, Game.amountX * 2 * oInput.value);
- }
- }
- oInput.addEventListener('input',
- function() {
- if (!this.value) {
- this.value = 0;
- } else {
- if (this.value > 9999) {
- this.value = 9999;
- } else {
- this.value = parseInt(this.value);
- }
- }
- money.innerHTML = Game.count.accMul(Game.num, Game.amountX * 2 * this.value);
- },
- false);
- },
- 'controlSelect': function() {
- var oInput = document.getElementById('c_l_b_f_beishu');
- var money = document.getElementById('money');
- var oMode = document.getElementById('sel_mode');
- oMode.addEventListener('input',
- function() {
- switch (this.value) {
- case '1':
- Game.num = 1;
- break;
- case '2':
- Game.num = 0.1;
- break;
- case '3':
- Game.num = 0.01;
- break;
- }
- money.innerHTML = Game.count.accMul(Game.num, Game.amountX * 2 * oInput.value);
- },
- false);
- },
- 'empty': function() {
- var oDiv = document.getElementById('c_l_number');
- var emptyBtn = document.getElementById('c_l_b_deledNum');
- var oText = document.getElementById('c_l_data');
- var money = document.getElementById('money');
- var amount = document.getElementById('zhushu');
- var listUl = document.getElementById('c_r_l_ul');
- var oInput = document.getElementById('c_l_b_f_beishu');
- var oMode = document.getElementById('sel_mode');
- var jiangjin = document.getElementById('jiangjin');
- var arr = ['三星直选', '定位胆', '大小单双'];
- emptyBtn.onclick = function() {
- if (parseInt(money.innerHTML * 999)) {
- var json = {
- a: jiangjin.innerHTML,
- b: amount.innerHTML,
- c: oInput.value,
- d: money.innerHTML,
- e: Game.targetData,
- f: Game.num
- };
- Game.OrderArr.push(json);
- var oLi = document.createElement('li');
- oLi.innerHTML = '<span data-step="' + Game.wanfa + '">' + arr[Game.wanfa] + '</span><span>' + amount.innerHTML + '</span><span>' + oInput.value + '</span><span>' + money.innerHTML + '</span><span class="list_close">×</span>';
- listUl.appendChild(oLi);
- /************************************************************/
- oDiv.innerHTML = '';
- oText.innerHTML = '';
- money.innerHTML = '0';
- amount.innerHTML = '0';
- switch (parseInt(Game.step)) {
- case 0:
- Game.addInitCase1();
- break;
- case 1:
- Game.addInitCase1();
- break;
- case 2:
- Game.addInitCase2();
- break;
- }
- Game.getNumData(Game.step);
- Game.control();
- Game.amountX = 0;
- if (Game.OrderArr.length) {
- Game.delOrder();
- Game.pushIn();
- }
- } else {
- if (parseInt(amount.innerHTML)) {
- alert('提交注单失败,请您核实投注金额重新提交!');
- } else {
- alert('请您提交号码,再提交订单哟!');
- }
- }
- }
- },
- 'delOrder': function() {
- var oUl = document.getElementById('c_r_l_ul');
- var closeBtn = this.getClassName(oUl, 'list_close');
- for (var i = 0; i < closeBtn.length; i++) {
- closeBtn[i].index = i;
- closeBtn[i].onclick = function() {
- Game.OrderArr.splice(this.index, 1);
- this.parentNode.parentNode.removeChild(this.parentNode);
- }
- }
- },
- 'pushIn': function() {
- var supMoney = document.getElementById('supMoney');
- var oPushBtn = document.getElementById('c_r_t_btn');
- oPushBtn.onclick = function() {
- var money = 0;
- var pM = Game.personMon.innerHTML;
- if (Game.OrderArr.length) {
- for (var i = 0; i < Game.OrderArr.length; i++) {
- money = Game.count.accAdd(money, Game.OrderArr[i].d)
- }
- if (pM > money) {
- if (confirm('您选择' + Game.OrderArr.length + '个注单,投注总金额' + money + '元')) {
- Game.personMon.innerHTML = Game.count.accSubtr(pM, money);
- supMoney.innerHTML = '-' + money;
- move(supMoney, {
- top: '50px',
- opacity: '0'
- },
- '50',
- function() {
- supMoney.innerHTML = '';
- this.style.cssText = 'top:0;opacity:1;';
- });
- Game.kaijiang(Game.getAward);
- } else {
- }
- } else {
- alert('余额不足,请充值后再进行投注!');
- }
- } else {
- alert('请您选择号码,提交注单后投注!');
- }
- }
- },
- 'kaijiang': function(callback) {
- var result = [];
- var off = false;
- var oSpan = document.getElementById('G_t_k_num').children;
- var listUl = document.getElementById('c_r_l_ul');
- for (var i = listUl.children.length - 1; i >= 0; i--) {
- listUl.children[i].parentNode.removeChild(listUl.children[i]);
- }
- for (var i = 0; i < oSpan.length; i++) {
- oSpan[i].className = 'kaijiang';
- oSpan[i].style.transitionDelay = '0s';
- }
- setTimeout(function() {
- for (var i = 0; i < oSpan.length; i++) {
- var n = Math.floor(Math.random() * 10);
- result.push(n);
- oSpan[i].className = '';
- oSpan[i].style.transitionDelay = i * 0.3 + 's';
- oSpan[i].style.backgroundPosition = Game.numPos[n];
- }
- return callback(result);
- },
- 1500);
- },
- 'getAward': function(res) {
- var issue = document.getElementById('G_t_k_t_issue');
- var oBox = document.getElementById('c_r_r_box');
- issue.innerHTML = addZero(Game.qishu);
- if (oBox.children.length == 5) {
- var removeObj = oBox.children[4];
- removeObj.parentNode.removeChild(removeObj);
- }
- var oLi = document.createElement('li');
- oLi.innerHTML = '<span class="qishu">' + addZero(Game.qishu) + '</span><span class="haoma">' + res + '</span>';
- if (oBox.children.length) {
- oBox.insertBefore(oLi, oBox.children[0])
- } else {
- oBox.appendChild(oLi);
- }
- function addZero(a) {
- a++;
- if (a < 10) {
- return '00' + a;
- } else if (a < 100) {
- return '0' + a;
- } else {
- return '' + a;
- }
- }
- Game.qishu++;
- Game.setMoney(res);
- Game.targetData.length = 0;
- },
- 'setMoney': function(res) {
- var addMoney = document.getElementById('addMoney');
- var regB = /百位/,
- regS = /十位/,
- regG = /个位/;
- var bArr = [],
- sArr = [],
- gArr = [];
- var san = res[2] + "" + res[3] + "" + res[4];
- var arr = [];
- arr.push(((res[2] % 2 ? '单': '双') + (res[3] % 2 ? '单': '双')));
- arr.push(((res[2] > 4 ? '大': '小') + (res[3] % 2 ? '单': '双')));
- arr.push(((res[2] > 4 ? '大': '小') + (res[3] > 4 ? '大': '小')));
- var moneyAward = 0;
- var n = null;
- for (var i = 0; i < this.OrderArr.length; i++) {
- n = this.OrderArr[i]
- switch (n.a) {
- case '1800':
- for (var z = 0; z < n.e.length; z++) {
- if (san == n.e[z]) {
- moneyAward = this.count.accAdd(moneyAward, this.count.accMul(n.a * n.c, n.f));
- break;
- }
- }
- break;
- case '18':
- var k = 0;
- for (var z = 0; z < n.e.length; z++) {
- if (regB.test(n.e[z])) {
- if (new RegExp(res[2]).test(n.e[z])) {
- k++;
- continue;
- }
- } else if (regS.test(n.e[z])) {
- if (new RegExp(res[3]).test(n.e[z])) {
- k++;
- continue;
- }
- } else if (regG.test(n.e[z])) {
- if (new RegExp(res[4]).test(n.e[z])) {
- k++;
- continue;
- }
- }
- }
- moneyAward = this.count.accAdd(moneyAward, this.count.accMul(n.f, n.a * k * n.c));
- break;
- case '7.8':
- //中奖注数初始值
- var j = 0;
- for (var z = 0; z < n.e.length; z++) {
- for (var x = 0; x < arr.length; x++) {
- if (n.e[z] == arr[x]) {
- j++;
- continue;
- }
- }
- }
- moneyAward = this.count.accAdd(moneyAward, this.count.accMul(n.f, n.a * j * n.c));
- break;
- }
- }
- if (moneyAward) {
- addMoney.innerHTML = '+' + moneyAward;
- move(addMoney, {
- top: '-50px',
- opacity: '0'
- },
- '50',
- function() {
- addMoney.innerHTML = '';
- this.style.cssText = 'top:0;opacity:1;';
- });
- }
- this.personMon.innerHTML = this.count.accAdd(this.personMon.innerHTML, moneyAward);
- this.OrderArr.length = 0;
- },
- 'getClassName': function(obj, cName) {
- var obj = obj || document;
- if (obj.getElementsByClassName) {
- return obj.getElementsByClassName(cName);
- } else {
- var arr = [];
- var allE = obj.getElementsByTagName('*');
- for (var i = 0; i < allE.length; i++) {
- var allElements = allE[i].className.split(' ');
- for (var j = 0; j < allElements.length; j++) {
- if (allElements[j].className == cName) {
- arr.push(allE[i]);
- break;
- }
- }
- }
- return arr;
- }
- },
- 'count': {
- //乘
- 'accMul': function(a, b) {
- var m = 0,
- s1 = a.toString(),
- s2 = b.toString();
- try {
- m += s1.split(".")[1].length
- } catch(e) {}
- try {
- m += s2.split(".")[1].length
- } catch(e) {}
- return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
- },
- //除
- 'accDiv': function(a, b) {
- var t1 = 0,
- t2 = 0,
- r1, r2;
- try {
- t1 = a.toString().split(".")[1].length
- } catch(e) {}
- try {
- t2 = b.toString().split(".")[1].length
- } catch(e) {}
- with(Math) {
- r1 = Number(a.toString().replace(".", "")) r2 = Number(b.toString().replace(".", "")) return (r1 / r2) * pow(10, t2 - t1);
- }
- },
- //加
- 'accAdd': function(a, b) {
- var r1, r2, m;
- try {
- r1 = a.toString().split(".")[1].length
- } catch(e) {
- r1 = 0
- }
- try {
- r2 = b.toString().split(".")[1].length
- } catch(e) {
- r2 = 0
- }
- m = Math.pow(10, Math.max(r1, r2)) return (a * m + b * m) / m;
- },
- //减
- 'accSubtr': function(a, b) {
- var r1, r2, m, n;
- try {
- r1 = a.toString().split(".")[1].length
- } catch(e) {
- r1 = 0
- }
- try {
- r2 = b.toString().split(".")[1].length
- } catch(e) {
- r2 = 0
- }
- m = Math.pow(10, Math.max(r1, r2));
- n = (r1 >= r2) ? r1: r2;
- return ((a * m - b * m) / m).toFixed(n);
- }
- }
- }
sports-1.0-js.js
- function getStyle(obj, attr) {
- if (obj.currentStyle) {
- return obj.currentStyle[attr];
- } else {
- return getComputedStyle(obj, false)[attr];
- }
- }
- function move(obj, json, num, fn) {
- var timer = null,
- attr = null;
- iCur = null,
- iTarget = null,
- iSpeed = null;
- clearInterval(obj.timer);
- obj.timer = setInterval(function() {
- var onOff = true;
- for (attr in json) {
- iTarget = json[attr];
- iTarget = parseInt(iTarget);
- if (attr == "opacity") {
- iCur = parseInt(parseFloat(getStyle(obj, attr) * 100));
- if (isNaN(iCur)) {
- iCur = 100;
- }
- } else {
- iCur = parseInt(getStyle(obj, attr));
- }
- if (iCur < iTarget) {
- iSpeed = Math.ceil((iTarget - iCur) / num);
- } else {
- iSpeed = Math.floor((iTarget - iCur) / num);
- }
- if (iCur != iTarget) {
- onOff = false;
- if (attr == "opacity") {
- obj.style[attr] = (iCur + iSpeed) / 100;
- obj.style.filter = "alpha(opacity=iCur+iSpeed)";
- } else {
- obj.style[attr] = iCur + iSpeed + "px";
- if (Math.abs(iSpeed) > Math.abs(iTarget - iCur)) {
- obj.style[attr] = iTarget + "px";
- }
- }
- }
- }
- if (onOff) {
- clearInterval(obj.timer);
- fn && fn.call(obj);
- }
- },
- 30);
- }
来源: http://www.phperz.com/article/17/0520/331599.html