前端黑科技——纯clip-path打造的3D模型渲染器

⚠警告:

  • 本页DEMO只兼容到webkit浏览器(如chrome), 请确保你的正确打开姿势

  • 本文涉及到的资源clip3d: https://github.com/leeluolee/clip3d

  • 前戏较长, 请耐心..

缘由

几天之前, 一个species-in-pieces的网站把我震到了(如下图), 出于一个优秀前端的敏锐嗅觉和原始本能
我立刻祭出了看家法宝——Chrome开发者工具开始偷窥这个网站.

species in pieces

简单推敲之后,我发现其实原理可以归结为一个属性—clip-path, 又一篇博文的材料到手!
当我兴高采烈的将我的《Species in Pieces原理解析》进行到一半时,发现First blood在weibo上已经被人抢了.