You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<!DOCTYPE html> <html lang="en">
<head> <meta charset="utf-8" /> <title>长征</title> <meta name="keywords" content="keyword1,keyword2,keyword3"> <meta name="description" content="this is my page"> <meta name="content-type" content="text/html; charset=UTF-8"> <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"> <script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/style.js" type="text/javascript" charset="utf-8"></script> <link rel="stylesheet" type="text/css" href="css/style.css" /> <link rel="stylesheet" type="text/css" href="css/index.css" /> </head> <body> <div id="wrap"> <!--加载页--> <div class="loading"> <img src="img/loading.png" class="load" /> <!--进度条--> <div class="flex-center"> <h3>加载中...</h3> <span class="container"> <span id="progressBar" class="h-100P bar"><text></text></span> </span> </div> </div> <!--开始页--> <div class="begin"> <div id="begin"></div> </div> <!--第一关--> <div class="firstGame"> <div id="game1"></div> </div> <!--第二关--> <div class="secondGame"> <div id="game2"></div> </div> <!--第三关--> <div class="thirdGame"> <div id="game3"></div> </div> <!--第四关--> <div class="fourGame"> <div id="game4"></div> </div> <!--第五关--> <div class="fiveGame"> <div id="game5"></div> </div> <!--成功--> <div class="win"> <div id="success"></div> </div> </div>
</body>
</html> <script src="js/common.js" type="text/javascript" charset="utf-8"></script> <script> alert('建议横屏使用!') $("#begin").load("begin.html"); $("#game1").load("game1.html"); // $("#game2").load("game2.html"); // $("#game3").load("game3.html"); // $("#game4").load("game4.html"); // $("#game5").load("game5.html"); // $("#success").load("success.html"); $(document).ready(function() { //进度条 var percentage = 0; var interval = setInterval(function() { if(percentage < 500) { percentage++; var widthTemp = (percentage / 5).toFixed(1) + '%'; $('#progressBar').css('width', widthTemp); } else { clearInterval(interval); setTimeout(function() { clearInterval(interval) $('.flex-center').fadeOut(10) // $('.begin').fadeIn(100) $('.load').attr('src','img/begin.png') $('.begin').css('display','block') }, 500); } }, 10); }); </script>
|