如何让这个滑块更流畅？
How to make this slider more fluid?
我刚刚构建了一个基于 CSS 缩放、模糊和位置转换的自定义滑块。
演示： https://jsfiddle.net/Paf_Sebastien/sjxrtny8/
不要专注于功能，我只想让它更流畅。
想法是有一套"cards"。第一个是锐利的并且具有正常大小，以下是更小，模糊和缩小的。越远越模糊越小
如何处理动画：jQuery 检查并更新位置，然后为每张卡片赋予新的位置、模糊和缩放。所以 CSS 更改是即时进行的 ，并且 动画是由 CSS transition 属性.
- 有什么建议可以让它更流畅？
- 我应该使用其他类似 jQuery 动画的东西吗？
CSS 动画在性能方面存在局限性。对于像转换这样的简单事情，CSS 做得很好。但是任何更复杂的东西，IMO，结合模糊和其他过渡都会减慢速度。
jQuery 具有动画功能，但它不是动画库。所以它的 animate() 方法有时很慢。
出于您的目的，我建议使用性能更高的真实动画库。我想到了两个库：GSAP 和 Velocity。
为什么 jQuery 不适合动画
http://davidwalsh.name/css-js-animation
GSAP
http://greensock.com/gsap
GSAP 对比 CSS3 性能：https://greensock.com/transitions/
Velocity.js
http://julian.com/research/velocity/
它们的语法都非常容易理解，根据我的经验，它们的性能非常好，即使在移动设备上也是如此。
我刚刚构建了一个基于 CSS 缩放、模糊和位置转换的自定义滑块。
演示： https://jsfiddle.net/Paf_Sebastien/sjxrtny8/
不要专注于功能，我只想让它更流畅。
想法是有一套"cards"。第一个是锐利的并且具有正常大小，以下是更小，模糊和缩小的。越远越模糊越小
如何处理动画：jQuery 检查并更新位置，然后为每张卡片赋予新的位置、模糊和缩放。所以 CSS 更改是即时进行的 ，并且 动画是由 CSS transition 属性.
- 有什么建议可以让它更流畅？
- 我应该使用其他类似 jQuery 动画的东西吗？
CSS 动画在性能方面存在局限性。对于像转换这样的简单事情，CSS 做得很好。但是任何更复杂的东西，IMO，结合模糊和其他过渡都会减慢速度。
jQuery 具有动画功能，但它不是动画库。所以它的 animate() 方法有时很慢。
出于您的目的，我建议使用性能更高的真实动画库。我想到了两个库：GSAP 和 Velocity。
为什么 jQuery 不适合动画
http://davidwalsh.name/css-js-animation
GSAP
http://greensock.com/gsap
GSAP 对比 CSS3 性能：https://greensock.com/transitions/
Velocity.js
http://julian.com/research/velocity/
它们的语法都非常容易理解，根据我的经验，它们的性能非常好，即使在移动设备上也是如此。