parallax.js – 快速实现层次化网页的好帮手

可能你也像我一样想实现一个类似Github 404页面那样的层次化效果的网页，但又不想太过费事。parallax.js在这时绝对能让你眼前一亮。

Parallax.js是一个专门用户制作“可感应”页面的工具。说到可感应你或许首先想到的是“响应式”设计，但其实这里所说的“可感应”指的是用户与网页的一种交互。在智能手机等手持设备上，设备的螺旋仪就是一种交互手段。而在桌面计算机上，鼠标则也是一种交互手段。

如果你希望页面随鼠标呈现出层次化的动画效果，那么你可以考虑考虑Parallax.js。

如何使用

Parallax.js的使用是基于DOM的，考虑如下DOM：

这便是Parallax.js的一个典型场景，其中data-depth表示的是该元素所处的层次。之后我们初始化：

var scene = document.getElementById('scene');
var parallax = new Parallax(scene);

或者你有jQuery：

$('#scene').parallax();

简直是太简单了。

哦耶，MIT。