用 impress.js 制作 About Me 页面

JavaScript Aug 28, 2014

通过使用 impress.js 实现网站的 About Me Page ,感觉棒棒哒~~

「很早就知道 impress.js 这么个开源项目,但是一直很(hen)忙(lan),没空加内容进去,所以也就一直没有发布到网上来。昨天闲的无聊,晚上开始弄一直到凌晨4点。」

就写个总结,以免以后又忘记了,内容简单,勿喷。

这次就是忘记了,浪费了好多时间 >.<

<div id="its-in-3d" class="step" data-x="0" data-y="0" data-z="0" data-rotate="0" data-rotate-x="0" data-rotate-y="0" data-scale="1">

缩放参数

可以把整张 impress.js 显示界面想象为几层

data-scale=""

就是用来设置层级的,数字由小到大,层级由里到外

「小数也是可以的哦~」

位置参数

* data-x
* data-y
* data-z  //前面三个参数很简单的。「以最先显示的文本作为坐标圆点,立体直角坐标系」
* data-rotate  //第四个参数表示以垂直于屏幕的直线为轴旋转当前文本(假定只有文本)
「整数顺时针,负数逆时针。」
* **data-rotate-x**   // 以横向平行与屏幕的直线为轴旋转(正数轴上方往里面轴下方往外面旋转)
* **data-rotate-y**   // 以纵向向平行与屏幕的直线为轴旋转(正数 轴右方往里面轴左方往外面
* **data-rotate-z**   // 后来发现和 data-rotate 一样。
//艾玛,为自己智商捉急啊,好久才弄明白呢。


暂时就这样.....



Tags

Great! You've successfully subscribed.
Great! Next, complete checkout for full access.
Welcome back! You've successfully signed in.
Success! Your account is fully activated, you now have access to all content.