一個相似宣傳的H5頁面

趁着閒置 作了一個H5的頁面 感受不錯。

具體效果以下

 

框架上我選擇

zepto（其實這個無關緊要，推薦用原生的最好）

FullPage （感受挺好用的一個全屏滾動插件 ）

pageResponse （H5的一個適配小工具，感受挺好用）

FullPage

pageResponse

頁面樣式 其實爲了方便有些東西直接寫在標籤中了

一個小小的延時加載

var len = $("img").length;
var counter = 0;
for ( var i = 0, img; i < len; i++) {
    img = $("img")[ i ];
     if (!img.getAttribute("load")) {
        img.src = img.getAttribute("url");
    }
    img.onload =  function () {
        counter++;
         if (counter >= len) {
        }
    };

} 

在MP3預加載完畢之後自動切換帶第一頁

play.addEventListener("canplaythrough",  function () {
        runPage.go(1);
    }

); 

這裏我在插件中runPage.removePage('page1’);

根據類名刪除元素，更具索引的話會有些坑爹

還有一些CSS3的加載動畫幀 總之東西很多

後面有些問題我會繼續修正和修改，歡迎來個人GIT奪走源碼，代碼沒有壓縮想壓縮的話本身壓縮
https://github.com/Mrxdh 喜歡的話能夠幫忙點擊Follower