目前想做一个通过雪碧图做成的GIF动画。
实现功能：
长条雪碧图实现GIF（主要能实现GIF就行，多图的话第一次要多次请求各个图的资源，会有闪烁而且耗资源）
窗口自适应（雪碧图的窗口）
宽度始终使用%，非定宽
高度父容器随子容器变化
子容器的高度随图片宽度变化而变化
基本上就是利用修改background-position的数值，对背景图片展示的位置进行修改。
自适应的方式利用了img图片对父容器撑起高宽的方式实现的。
然后利用cover属性进行的背景图片缩放。
因为搞前端真的只有一个月多，大神轻喷。。
现阶段遇到一个问题：
在窗口变动之后（也就是imgp），雪碧图的高宽也要变动。cover实现的。但是出现一个问题，无法获取雪碧图变化后的宽度，无法使用px？使用%的话，其真实的效果还需要引入margin将自身变化的数值（怎么搞？不能动态计算吧，每个step的数值怎么计算）（参考链接： position1 position2）
用%的方法是可以，但是出现了抖动。感觉是由于自适应之后产生的误差引起的。貌似没办法解决啊。难道说是需求有问题还是这个实现方法不好？
所以，怎么实现我的需求？有懂的大神给个方案么？
代码如下：
0
389
p
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
收藏
欢迎选择我的课程，让我们一起见证您的进步~~