.jpg)
试试HTML的
.jpg)
这个话题我最近刚踩了个大坑。去年吧，我在一个技术论坛上看到一个教程，说用HTML5的canvas或者SVG可以给照片添加动效。我心想，这不就是想给用户带来点新鲜感嘛，于是我就跟着教程捣鼓起来。
当时我在一个电商网站做UI设计，想给产品页面上的图片加个轻微的旋转效果，感觉这样能让页面不那么死板。结果呢，坑一大堆。首先，canvas和SVG的操作复杂，调试起来特别费劲。我花了两天时间才把效果做到差不多，结果页面加载速度直接下降了30%，用户体验一落千丈。
还有一次，一个朋友让我帮忙美化他的个人博客。他想要在首页展示一系列的风景照片，每张照片都能轻微飘动。我心想，这还不简单，就用了SVG。结果呢，图片飘动得特别厉害，看起来像是地震现场，用户体验简直糟糕透顶。
所以呢，我个人觉得，除非真的有必要，否则不建议给照片添加复杂的动效。简单点，比如轻微的放大缩小，可能还能接受。不过这块我没碰过，不敢乱讲哈。总之，实践出真知，踩过坑才知道哪条路是好的。
当时我在一个电商网站做UI设计，想给产品页面上的图片加个轻微的旋转效果，感觉这样能让页面不那么死板。结果呢，坑一大堆。首先，canvas和SVG的操作复杂，调试起来特别费劲。我花了两天时间才把效果做到差不多，结果页面加载速度直接下降了30%，用户体验一落千丈。
还有一次，一个朋友让我帮忙美化他的个人博客。他想要在首页展示一系列的风景照片，每张照片都能轻微飘动。我心想，这还不简单，就用了SVG。结果呢，图片飘动得特别厉害，看起来像是地震现场，用户体验简直糟糕透顶。
所以呢，我个人觉得，除非真的有必要，否则不建议给照片添加复杂的动效。简单点，比如轻微的放大缩小，可能还能接受。不过这块我没碰过，不敢乱讲哈。总之，实践出真知，踩过坑才知道哪条路是好的。