Vue3.0组件—banner轮播图(渐入渐隐效果)
①组件图片切换有三种方式,第一种是图片两边按钮切换,第二种是点击图片下方小横条切换,第三种是自动切换;②子组件props的属性:listBanner(播放的图片源)、interval(图片播放的间隔时间)、 autoSwitc(是否自动播放banner)、 setHeight(banner的高度);③给切换图片的标签添加ref,改变ref属性中的opacity,切换透明度,达到图片渐隐渐显的效果,再给对应标签样式中添加`transition-duration: 1.5(片透明度切换的时间)
原创
2022-09-19 17:47:45 ·
4533 阅读 ·
0 评论