怎么使用impress.js
官网
缺点:许多细节都要自己指定,特别是页面宽度
优点:有全局的感觉,很炫
用法
官网指南
DEMO
功能设置
- 在每张slide的div标签中设置以下属性
- data-x 沿着X轴移动的距离,负数表示向左移
- data-y 沿着y轴移动的距离,负数表示向下移
- data-z 沿着z轴移动的距离,负数表示向内移
- data-scale 放大/缩小的比例,负数表示缩小
- data-rotate 用设置的度数旋转slide
- data-rotate-x 绕着X轴旋转,负数表示向后转
- data-rotate-y 绕着Y轴旋转,负数表示向右转
- data-rotate-z 绕着Z轴旋转
基础代码
- 一个html文件
- 在html中必须调用以及初始化impress.js
- 使用
id="impress"
的div 在其中每个slide写一个div,并且class="step"
- 模版代码