使用姿勢
在設(shè)計全屏滾動插件的時候,希望開發(fā)者幾乎:
不用寫任何腳本快速生成精致H5
支持PC滾輪和移動觸摸
酷炫的轉(zhuǎn)場動效
靈活的時間軸管理
一切皆可配置
但是不寫腳本肯定沒有靈活性咯?!不是的。這里不僅僅可以通過在HTML配置一些參數(shù),還可通過插件的回調(diào)函數(shù)進行一些邏輯注入。就拿上面大家掃碼看到的例子的部分HTML來分析下AlloyTouch.FullPage的使用姿勢:
<div id="fullpage"> <div> <div> <div class="animated" data-show="bounceInLeft" data-hide="bounceOutLeft">AlloyTouch Introduction</div> <div class="animated" data-delay="500" data-show="bounceInUp" data-hide="zoomOut"><img src="asset/alloytouch.png"></div> <div class="animated" data-delay="1200" data-show="bounceIn" data-hide="bounceOut">By AlloyTeam</div> </div>