利用Taro的Swiper组件实现3D 覆盖流效果
-
实现效果图下图：
由于Swiper组件父级容器默认会添加一个css样式.swiper-container，默认是overflow: hidden。
这样就造成了，超出父级容器子元素被隐藏掉：
解决办法：
给Swiper组件添加一个叫.swiperCard的className，里面样式添加overflow: inherit !important;这样就可以覆盖掉默认.swiper-container中overflow: hidden。
如果想实现3D效果可以利用transform: translate3d(0px, 0px, 0) rotateX(0deg) rotateY(0deg) scale(0.8);来实现。类似于下图都可以
-
@yanchengqu 666
-
-
@yanchengqu 3D过度再添加一个过度时间：
transition-property: transform;
transition-duration: 300ms;
-
-
有木有代码可以学习一下
-
@杨树林 参考这个链接https://testpdjm.jd.com/activity/vplus/index.html#/pages/vplus_t5/ball/index?activeIndex=2
-
@yanchengqu 要不搞成个物料放物料市场去吧，https://taro-ext.jd.com 大家可以直接下载代码围观