<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>微场景</title> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta name="apple-touch-fullscreen" content="YES"> <meta name="format-detection" content="telephone=no"> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black"> <!-- css--> <link rel="stylesheet" href="css/animate.min.css"/> <link rel="stylesheet" href="css/zepto.fullpage.css"/> <link rel="stylesheet" href="css/microScene.css"/> </head> <body> <div id="audio-container"></div> <div class="loading" id="loading"> <img src="img/chetaixian.png" alt="loading..."/> </div> <div class="wp" id="smWp" style="visibility: hidden"> <div class="wp-inner"> <div class="page page1"> <div class="page-header zoomIn"> <h2>一片落叶，编织未来。</h2> </div> <section class="img-wrapper"> <div class="img-box zoomIn "> <img src="img/active/000$_$ (1).jpg"/> </div> <div class="text-box fadeInDownBig"> <div class="ms-text" style="color: deeppink"> <p>你若盛开，清风自来。</p> </div> </div> </section> <section class="img-wrapper" style="margin-top: 20px"> <div class="img-box zoomIn "> <img src="img/active/000$_$ (2).jpg"/> </div> <div class="text-box fadeInUpBig"> <div class="ms-text" style="color: mediumseagreen"> <p>心若浮沉，浅笑安然。</p> </div> </div> </section> </div> <div class="page page2"> <div class="text-zoom hide zoomIn"> <p>琉璃火，众人夺，静看掌心萤光烁，枉生枪，千古封，错踏凡尘葬往生， 三生石，黄泉路，奈何桥上人久驻，忘川水，舟轻渡，彼岸花开天下覆。</p> </div> </div> <div class="page page3"> <div class="white-box hide fadeInLeftBig"></div> <div class="text-text1 hide zoomIn"> <h2>龙凤山原生态休闲度假村</h2> </div> <div class="text-text2 hide fadeInLeftBig"> <p> 抛开所有的烦恼， 远离城市喧嚣， 看湖光山色， 听风林此起彼伏， 吃农家鲜到酣畅淋漓， 还有什么有比这更让人向往的吗？ </p> </div> </div> <div class="page page4"> <div class="text-text3 hide zoomIn"> <p>成功报名的小伙伴们还享有额外福利:</p> <p>二日游武汉车友会福利特价：0元/人（餐费自理！） （行程所有景点全部免费，景区酒店免费 台球、乒乓球、围棋、象棋、 泡脚项目免费，晚上篝火晚会免费，餐费自理，采摘根据自己的需求自由选择） </p> </div> </div> <div class="page page5"> <div class="active-header hide fadeInDownBig"> <h2>立刻报名</h2> <p>活动时间</p> <p>10.19-11.19</p> </div> <div class="form-box hide zoomIn"> <section class="form-box-wrapper"> <div class="sm-input"> <input type="text" placeholder="姓名"/> </div> <div class="sm-input"> <input type="text" placeholder="手机号"/> </div> <div class="sm-input"> <input type="text" placeholder="几个人"/> </div> <div class="sm-input"> <input type="text" placeholder="几台车"/> </div> <div class="sm-input"> <button>提交</button> </div> </section> </div> </div> </div> </div> <span class="start"><b></b></span> <!-- js--> <script src="js/zepto.min.js"></script> <script src="js/zepto.fullpage.js"></script> <script src="js/microScene.js"></script> <script> document.onreadystatechange = loading; function loading(){ if(document.readyState == "complete") { _$("loading").style.display="none"; // alert('....'); _$("smWp").style.visibility="visible"; playMusic(); } } Zepto(".wp-inner").fullpage({ drag: true, start: 0, duration: 50, page: '.page', der: 0.01, change: function (e) { console.log('change', e.next, e.cur); // alert(e.cur); // setTimeout(function(){ // $(".page"+(e.cur+1)).find("div").hide().removeClass("animated"); // },1500); }, beforeChange: function (e) { console.log('beforeChange', e.next, e.cur); $(".page"+(e.next+1)).find("div").hide().removeClass("animated"); }, afterChange: function (e) { console.log('afterChange', e.next, e.cur); // alert( e.cur); $(".page"+(e.cur+1)).find("div").show().addClass("animated"); } }); </script> </body> </html>
扫一扫
1441
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
