Impress.js是一个表示层框架(演示工具)，受Prezi启发，由一个国外开发者用CSS3和JavaScript完成。有兴趣的朋友跟边肖学。

1、对impress.js认识

Impress.js是由CSS3和JavaScript语言完成的，可供开发者使用的表示层框架(演示工具)。

现在普通开发者可以使用impress.js开发自己的演示工具，效果差不多，但是性能比基于FLASH的Prezi要好。它的功能包括画布的无限旋转和缩放，任意角度放置任意大小的文本，CSS3 3D效果支持等。同时，它还支持传统的PowerPoint幻灯片演示。

目前impress.js是基于webkit浏览器(Chrome、Safari)开发的，其他基于非webkit引擎但支持CSS3 3D的浏览器也可以正常运行。

2、使用impress.js

impress.js简介：

复制代码如下：

script src=' js/impress . js '/script

现在，您可以看到创建新的幻灯片放映是多么容易。每个幻灯片都是一个div元素(在包装器内部),其类名为“step”。

复制代码如下：

div class='step '

我的第一张幻灯片

/div

虽然是为了创建一个简单的幻灯片，但是当你开始给你的幻灯片添加数据属性的时候还是很有意思的。当幻灯片不是活动幻灯片时，数据属性表示幻灯片的属性。您可以使用以下数据属性：

Data-x=幻灯片的X坐标

Data-y=幻灯片的Y坐标

数据比例=通过指定值进行缩放。如果数据比例为5，幻灯片的原始尺寸将放大5倍。

数据-旋转=将幻灯片旋转一定角度。

数据-旋转-x=用于3D。这个数字度数就是它应该相对于X轴旋转多少度。(向前/向后倾斜)

Data-rotate-y=用于3D。这个数字度数就是它应该相对于Y轴旋转多少度。(左回转/右回转)

Data-rotate-z=用于3D。这个数字度数就是它应该相对于Z轴旋转多少度。

实例目录：

以上是我对impress.js的初步了解，可能比较肤浅。此后，边肖将进一步研究它。请关注这个网站。

郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。