动态嵌套多层swiper时出现内容重叠情况

问题展示

问题图片

如上图所示:上图swiper嵌套了四级切换,属于上下级关系,但展示上有部分分级分开递归, swiper内容模块出现重叠,每切换一个内容会错乱并重叠展示

问题原因

切换时swiper没有更新下一个切换的内容,导致展示上一个swiper的内容还停留在画布(已添加:observer: true, observeParents: true。但没有效果)

问题解决

effect : 'fade',
fadeEffect: {
	crossFade: true,
}, //fade属性必须加上

正常界面

正常界面

具体代码:(JQuery语言)(三级swiper)

JQuery代码

HTML展示代码(.net framework语言)

HTML代码1

HTML2
HTML3

猜你喜欢

转载自blog.csdn.net/mrliucx/article/details/122625866