如何解决使用非常大的背景位置偏移是否存在性能问题?
| 我正在建立一个进度条控件,并且正在研究它实际上并没有显示进度,而只是显示“正在发生某种情况”的指示器。我为此设计的基本上是交替的斜条纹,基本上是像这样的理发杆,但是“旋转”: 希望尽可能多地将负载卸载到渲染引擎,为此我想使用CSS过渡。支持旧浏览器对我来说不是问题。 所以,我的第一个想法是基本上做到这一点:.barber-pole {
background-image: url(repeating-slice.png);
/* set a very long (one hour!) transition on the background-position */
transition: background-position 3600s linear 0s;
}
...,然后在将其呈现到屏幕上时,使用Javascript本质上可以做到这一点:
myBarberPole.style.backgroundPosition = \'-1000000px 0\';
是否存在有关以下方面的性能问题:
过渡了这么长时间
有background-position: -1000000px 0
吗?
或者,您有更好的解决方案吗?
解决方法
我认为可能不会有任何性能问题。这不是因为您使用大量数字会占用更多CPU或内存。
, 在没有“链式”过渡到自身的情况下(据我所知,没有纯CSS的方式来告诉过渡何时完成),这可能是一个很好的解决方案,但正如Justin所说,它需要一个庞大的图像!使用优质的老式GIF动画有什么问题吗?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。