| | |
|---|
| | | <script type="text/javascript" src="../static/js/object/CrnTask.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/object/Floor.js"></script> |
|---|
| | | <script type="text/javascript" src="../static/js/lib/btnHide.js"></script> |
|---|
| | | <style> |
|---|
| | | * { |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | html { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | body { |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | </style> |
|---|
| | | </head> |
|---|
| | | <body> |
|---|
| | | |
|---|
| | | <div id="mask" class="mask"></div> |
|---|
| | | |
|---|
| | | <img id="logo" class="logo" src="../static/img/logo0.png" alt=""/> |
|---|
| | | <div id="ship-info-box" class="ship-info-box"> |
|---|
| | | <div class="ship-type pointernone"> |
|---|
| | | <ul id="ship-type-ul"> |
|---|
| | | <li>初始化</li> |
|---|
| | | <li>待机…</li> |
|---|
| | | <li>您现在可以自由移动视角</li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <div class="speed pointernone"><span id="speed">0</span> <i id="speed-unit">%</i></div> |
|---|
| | | <div id="ship-info-btn" class="btn" data-type="1"> |
|---|
| | | <div id="btn-lock"></div> |
|---|
| | | <div class="btn-word">启动</div> |
|---|
| | | <div class="line line1"></div> |
|---|
| | | <div class="line line2"></div> |
|---|
| | | </div> |
|---|
| | | <div id="control-remind" class="remind">您现在可以自由移动视角</div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | |
|---|
| | | <div id="container"></div> |
|---|
| | | </body> |
|---|
| | | <script type="module"> |
|---|
| | |
|---|
| | | var player = new APP.Player(); |
|---|
| | | player.start(); |
|---|
| | | |
|---|
| | | document.getElementById("btn-lock").addEventListener('click', function () { |
|---|
| | | player.lockControl(); |
|---|
| | | removeClass(document.getElementById("ship-info-btn"), "show"); |
|---|
| | | document.getElementById("ship-type-ul").style.transform = 'translateY(-60px)'; |
|---|
| | | }, false); |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | <script> |
|---|
| | | var percent = 0; |
|---|
| | | var shipInfoBtn = document.getElementById("ship-info-btn"); |
|---|
| | | var speedDom = document.getElementById("speed"); |
|---|
| | | var timer = setInterval(function () { |
|---|
| | | if (percent < 99.95) { |
|---|
| | | percent += 0.15; |
|---|
| | | speedDom.innerText = percent.toFixed(2); |
|---|
| | | } else { |
|---|
| | | if (!hasClass(shipInfoBtn, "show")) { |
|---|
| | | addClass(shipInfoBtn, "show") |
|---|
| | | clearInterval(timer); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, 1); |
|---|
| | | |
|---|
| | | $(document).on('click','.btn-word', function () { |
|---|
| | | fullScreen() |
|---|
| | | $("#mask").fadeOut(3000, function () { |
|---|
| | | setTimeout(function () { |
|---|
| | | $("#ship-type-ul").css("transform", "translateY(-40px)"); |
|---|
| | | $("#ship-info-btn .btn-word").text("体验中扬立库"); |
|---|
| | | $("#ship-info-btn").data("type", 2).addClass("show"); |
|---|
| | | $("#ship-info-btn #btn-lock").css("z-index", "10"); |
|---|
| | | }, 1000); |
|---|
| | | }); |
|---|
| | | $("#logo").addClass("show"); |
|---|
| | | $("#ship-info-btn").removeClass("show"); |
|---|
| | | $('.speed.pointernone').addClass("hide"); |
|---|
| | | $("#ship-type-ul").css("transform", "translateY(-20px)"); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | </script> |
|---|
| | | </html> |
|---|
