酷炫的動(dòng)態(tài)切換

image

image

Reference API

html

根元素應(yīng)該包括在一個(gè)ID里面

 <div id="impress"></div>

子元素的div ID值為路由#ID

2D 屬性API

默認(rèn)生成，無(wú)限畫布，data-x,data-y是相對(duì)與畫布中心位置的偏移

 <div id="bored"  data-x="-1000" data-y="-1500">

data-rel-x,data-rel-y是相對(duì)于上一個(gè)位置的偏移

 data-rel-x="500" data-rel-y="1000"

其他的data-scale="4"，data-rotate = "90" 表示切換時(shí)的動(dòng)畫

JavaScript

impress( [ id ] )也可以這樣來(lái)定義根元素

var impressAPI = impress("root");

初始化 impressAPI .init();

卸載實(shí)例.tear()；

這可以用來(lái)“卸載”impress.js。對(duì)此的一個(gè)特殊用例是，如果要對(duì)演示文稿進(jìn)行動(dòng)態(tài)更改，可以進(jìn)行拆卸，應(yīng)用更改，然后init() 再次調(diào)用。

js動(dòng)態(tài)跳轉(zhuǎn)next();prev();

impress:stepenter；impress:stepleave自定義的事件

rootElement.addEventListener( "impress:stepenter", function(event) {
   var currentStep = event.target;
 /**/
 });

默認(rèn)事件是鍵盤的up,down?？勺孕刑砑悠渌?/p>

 document.addEventListener('mousewheel',mousewheel, false); 
 var status = true;  
 /*  impress:stepenter  在回調(diào)里將status置為true*/
 function mousewheel(event){
     if(status){
         status = false;
         if(event.wheelDelta>0){
           api.prev();     
         }else{
             api.next();
         }
     } 
 }

好了，可以使用滾輪了