swiper的这种效果怎么实现？-灵析社区
爬虫爬呀爬除开简单的轮播实现，焦点切换效果就是使用 `transform:scale()` 来实现缩放，搭配 `transition` 来实现补间效果。 如果简单的用CSS来实现的话，就是默认缩放（`transform:scale(0.8)`），当前激活卡片取消缩放（`transform:scale(1)`）。但是这样的话，就只有一个缩放效果。和问题中的GIF会差一点。 如果可以使用JS的话，原理也是一样的，可以通过当前激活的下标来给激活卡片的前1后1做不一样的缩放比例。 [横向循环焦点图片展示 -Swiper中文网](https://link.segmentfault.com/?enc=LaRm3WAXUvpvyG2mlpwPcQ%3D%3D.o4DA5XKIZS3yCQWtuBmA5bpNA6VuhoVVN0hm6bfjeuShxXS8Sox33tZzcymEO3ES)  [transform - CSS：层叠样式表 | MDN](https://link.segmentfault.com/?enc=VOqbK251GeTUC0Sb1pkYdQ%3D%3D.EmL%2FKosNrTmJFbwpD%2FWlXdMH8UPKDvyJlI%2Bexsn294neE24QJe9lJCjpoyI5DB8qent6d4jti%2BCnLQj1HwV7zg%3D%3D) [transition - CSS：层叠样式表 | MDN](https://link.segmentfault.com/?enc=p83BjRB76tqigKEBgcwZ5Q%3D%3D.OVSa5gKh3uw7wrcHpWxHC%2FHRHDDyysDNZ9M2y52sA921WIWxInnbQNnLfEEsskDs9regQuVLPHy9raCp%2FRrlOg%3D%3D)