reflection.js 1.5图片倒影效果
图片的倒影效果，用reflection.js v1.5就挺方便的。你只要给图片加个class="reflect"，其他的它都帮你搞定，响应也快，视觉上也挺酷。适合用在一些视觉要求高的场景，比如作品集展示、商品陈列页那种。
反射效果是通过Canvas和JavaScript生成的，兼容性还不错。你不用改图片源，原图直接用就行。整体上，入手门槛低，样式也能自定义。想多点控制的话，可以配合自己写点CSS。
如果你刚开始接触图片特效，推荐看看这篇《JS 实现图片倒影效果的完整步骤》，里面从思路到实现都讲得挺清楚。
另外，也可以参考下不同平台下的倒影实现思路，像Flex 的倒影效果、Android 3D 倒影源码、Unity Shader 水面倒影这些，都各有玩法，思路互通。
提醒下，reflection.js依赖图片加载完之后再执行，最好放在[removed]里，或者确认img元素都加载完成再调用，不然有时倒影会不出来。
如果你正好在做一个展示类的项目，又想加点不一样的效果，不妨试试它，轻量、易用，挺加分的。
文件大小：4.55KB
评论区