这是一款效果非常炫酷的不同风格页面布局幻灯片特效。该特效中，通过前后导航按钮来切换幻灯片，每个幻灯片中的图片均为不同的布局效果。
该幻灯片特效使用anime.js来制作幻灯片的动画特效，并使用很多CSS3属性，需要最新版本的现代浏览器才能看到效果。对于IE浏览器，前面几种效果可以在IE11及以上的浏览器看到效果，最后一种效果由于IE浏览器不支持SVG clip-path属性，所以是看不到效果的。
CSS样式 下面是其中一个布局的CSS样式：
.slide--layout-1 .slide__img:nth-child(n+2) {
left: calc(50% + 0.5em);
height: calc(50% - 0.5em);
}
.slide--layout-1 .slide__img:nth-child(3) {
top: calc(50% + 0.5em);
}
得到的效果如下图所示：
JavaScript 每一个幻灯片布局的动画效果定义在js文件中。结构为： [layout name] : { out : {navigating out properties},in : {navigating in properties} }。可以为进入和离开的幻灯片设置不同的动画效果。下面的代码是第一个布局的示例代码：
}
},layout2 : { / ... / },layout3 : { / ... / },/ ... /
}
};
