Impress.js上手
程序员文章站
2024-01-16 12:50:40
...
前言:
如果你已经厌倦了使用PPT设置路径、设置时间、设置动画方式来制作动画特效、那么Impress.js将是你一个非常好的选择。
用它制作的PPT将更加直观、效果也是嗷嗷美观的。
当然,如果用它来装X,是需要付出一些代价的,不过如果你是一个前端爱好者,理解HTML/CSS,那么就没什么问题了。
看看网上的实例,动手练习练习,分分钟就能上手了。
介绍:
impress.js 是国外一位开发者受 Prezi 启发,采用 CSS3 与 JavaScript 语言完成的一个可供开发者使用的表现层框架(演示工具)。 现在普通开发者可以利用 impress.js 自己开发出类似效果的演示工具,但性能比基于 FLASH 的 Prezi 更优。其功能包括画布的无限旋转与缩放,任意角度放置任意大小的文字,CSS3 3D 效果支持等。同时,也支持传统 PowerPoint 形式的幻灯演示。 目前 impress.js 是基于 webkit 浏览器(Chrome、Safari)开发,而在其它基于非 webkit 引擎,但支持 CSS3 3D 的浏览器也能正常运行。
演示:
手机暂时可能看不了,因为它是使用方向键(←/→)或Tab键切换播放的。
从下面的下载地址即可下载Impress.js的源码,里面附带了官网的效果Demo。
如果需要上面我做的那个例子,留言邮箱就OK了。
准备:
- Impress.js的源码已经发布在了GitHub上,下载即可:https://github.com/bartaz/impress.js。
- 浏览器:Chrome、Safari、FireFox、IE10(有的人说不行,不知道为什么)。
- 代码编辑器(在这里我用的是WebStorm)。
OK、一切准备就绪,开搞、
大家一步一步跟着写,impress.js怎么用就会秒懂了。
步骤一:
- 新建一个HTML页面,在