123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171 |
- <!DOCTYPE html>
- <html>
- <head>
- <title>跑步积分赛,抽奖赢豪礼</title>
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
- <meta name="screen-orientation" content="portrait">
- <meta name="x5-orientation" content="portrait">
- <link rel="stylesheet" type="text/css" href="./css/parkour.css">
- <style>
- #btn_img {
- animation: mymove 1s infinite;
- -webkit-animation: mymove 1s infinite;
- /*Safari and Chrome*/
- animation-direction: alternate;
- /*轮流反向播放动画。*/
- animation-timing-function: ease-in-out;
- /*动画的速度曲线*/
- /* Safari 和 Chrome */
- -webkit-animation: mymove 1s infinite;
- -webkit-animation-direction: alternate;
- /*轮流反向播放动画。*/
- -webkit-animation-timing-function: ease-in-out;
- /*动画的速度曲线*/
- }
- @keyframes mymove {
- 0% {
- transform: scale(1);
- /*开始为原始大小*/
- }
- 25% {
- transform: scale(1.2);
- /*放大1.1倍*/
- }
- 50% {
- transform: scale(1);
- }
- 75% {
- transform: scale(1.2);
- }
- }
- @-webkit-keyframes mymove {
- 0% {
- transform: scale(1);
- /*开始为原始大小*/
- }
- 25% {
- transform: scale(1.2);
- /*放大1.1倍*/
- }
- 50% {
- transform: scale(1);
- }
- 75% {
- transform: scale(1.2);
- }
- }
- #show {
- -webkit-animation: arrowBig .5s ease;
- animation: arrowBig .5s ease;
- animation-iteration-count: 1;
- animation-fill-mode: forwards;
- -webkit-animation-iteration-count: 1;
- -webkit-animation-fill-mode: forwards;
- }
- @-webkit-keyframes arrowBig {
- 0% {
- -webkit-transform: scale(0);
- opacity: 0;
- }
- 100% {
- -webkit-transform: scale(1);
- opacity: 1;
- }
- }
- @keyframes arrowBig {
- 0% {
- transform: scale(0);
- opacity: 0;
- }
- 100% {
- transform: scale(1);
- opacity: 1;
- }
- }
- </style>
- </head>
- <body ms-controller="parkour">
- <audio loop muted src="./img/bg.mp3" id="mediaId" autoplay="autoplay" preload=""></audio>
- <audio muted src="./img/show.mp3" id="mediaTwo" preload=""></audio>
- <div id="view-main">
- <div id="btn-begin"><img src="./images/start.png" style="width:150%" alt=""></div>
- </div>
- <div id="view-game">
- <div id="score-head" class="topbar">
- <div id="scrore" class="score" style="display: none;">{{@curIntegral}}</div>
- <div id="time" class="time" style="display: none;">{{@costSeconds}}s</div>
- </div>
- <div id="count-down" class="bg-3"></div>
- <div id="obstacle-prompt" style="display: none;">
- <div class="obstacle-name">眩晕</div>
- <div class="time">{{@vertigoTime}}</div>
- </div>
- </div>
- <div id="popup-container">
- </div>
- <div id="show" style="display: none;" class="popup-item">
- <img src="./images/hongbao.png" style="width: 80%;
- position: absolute;
- z-index: 10;" alt="">
- <img src="./images/qian.png" style="width: 35%;
- position: absolute;
- left: 43%;
- top: 30%;
- z-index: 10;
- margin-left: -20%;" alt="">
- <img src="./images/show_btn.png" id="btn_img" style="width: 50%;
- position: absolute;
- left: 40%;
- top: 50%;
- z-index: 10;
- margin-left: -25%;" alt="">
- </div>
- <!-- <div id="show" class="popup-item" style="display: none;">
- <div style=" width: 10rem;
- left: 25%;
- z-index: 200;
- height: 5rem;
- top: 35%;
- position: absolute;" id="btn_img"></div>
- </div> -->
- <script src="https://sf3-ttcdn-tos.pstatp.com/obj/union-fe-nc/playable/sdk/playable-sdk.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/avalon.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/jquery-3.1.0.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/touch.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/parkour.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/resLoader.min.js"></script>
- <script type="text/javascript" charset="utf-8" src="./js/jquery.cookie.min.js"></script>
- <script>
- $('#btn_img').on('touchstart', function (e) {
- e.preventDefault()
- e.stopPropagation()
- window.playableSDK.sendEvent('clickDownloadBar', {
- section: 'section2',
- area: 'area3'
- });
- window.playableSDK.openAppStore()
- })
- </script>
- </body>
- </html>
|