本篇文章主要介紹MIP元件的簡單使用方法。
MIP即行動網頁加速器,在前面的文章中已經給大家介紹過創建初始MIP檔案的方法以及需要注意的MIP規則#。
大家應該都知道MIP的優點在於提高行動網頁的載入速度,對行動裝置用戶是非常友善的。
那我們要怎麼去使用MIP元件呢?
首先大家要知道MIP元件包含哪些?
1、內建元件
內建元件是包含在 mip.js 中的元件,可直接使用,無需另外引進 JS 腳本。
2、個人化元件
個人化元件是滿足於特定需求的元件,包括互動、統計等需求。需要引入對應的 JS 腳本。
3、廣告元件
廣告元件主要滿足各類廣告的投放,需要引入對應的 JS 腳本。閱讀廣告文件來確定 MIP 廣告類型。
詳細元件內容可以參考PHP中文網的《MIP文件手冊》
這裡主要跟大家介紹MIP內建元件:mip- carousel 多圖輪播的使用示範。
902f1c57866cca807a43e508695816e8 用來支持 MIP 中圖片的一種展示方式,支援多圖輪播。
例如在初始的mip1.html檔案中使用加上mip-carousel副標題效果的多圖輪播,只要將以下程式碼加入6c04bd5ca3fcae76e30b72ad730ca86d中就可以了:
<mip-carousel autoplay defer="1000" layout="responsive" width="600" height="400" indicator buttonController > <a target="_blank" href="http://www.php.cn"> <mip-img src="你的图片地址" layout="responsive" width="600" height="400"></mip-img> <div class="mip-carousle-subtitle">这里是标题</div> </a> <mip-img src="你的图片地址"></mip-img> <mip-img src="你的图片地址"></mip-img> </mip-carousel>
基礎元件程式碼結構如上所示,大家可以依照自己的專案需求將MIP元件中的參數進行修改。
這篇文章就是關於MIP元件的簡單使用介紹,也是非常通俗易懂的,在後期的文章中會繼續給大家介紹MIP頁面的測試。有興趣的朋友可以持續關注PHP中文網。
以上是怎麼使用MIP元件的詳細內容。更多資訊請關注PHP中文網其他相關文章!