您好,登錄后才能下訂單哦!
本篇內容主要講解“怎么使用slip js”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“怎么使用slip js”吧!
slip是一個移動滑屏web框架,改庫大小5.75K,非常輕量,兼容ios5+、android2.3+系統,其滑屏功能,響應靈敏。
slip.js調用
varcontainer=document.getElementById('container');
varpages=document.querySelectorAll('.page');
varslip=Slip(container,'y').webapp(pages);
Slip:暴露到全局的方法,只要你引入slip.js,就可以得到這個實用牛逼的方法。
container:被滑動的容器,里面是每個滑動頁面。
'y':頁面滑動的方向,你也可以傳入'x'。
webapp:設置頁面展現為全屏滑動頁面的方法。
pages:頁面元素列表。
slip框架的頁面樣式
slip框架的頁面樣式需要自定義,不過這里我簡單寫好了~
(如果你不使用框架,推薦用transform:translate(X,Y)的寫法,首先transform:translate可設計高性能動畫,其次兼容android2.3+的系統,transform:translateY不兼容android2.3的系統)
兼容ios5+、android2.3+系統,其滑屏功能,響應靈敏~如果你只需要設計簡單的滑屏效果,可考慮它~
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<metacontent="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"name="viewport">
<metacontent="yes"name="apple-mobile-web-app-capable">
<metacontent="black"name="apple-mobile-web-app-status-bar-style">
<metacontent="telephone=no"name="format-detection">
<metacontent="email=no"name="format-detection">
<title>slip</title>
到此,相信大家對“怎么使用slip js”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。