如何使用 Vue-Carousel 在点击元素上滑动？

作者: 糖果
发布时间: 2024-04-19 12:24:03 (24天前)

2 条回复

1#
回复此人
糖果 | 2022-01-12 10-34

好的，我自己找到了解决方案。希望它可以帮助将来的人们:) 那是我的代码： <div class="VueCarousel-inner"> <carousel id="demo_carousel"> <slide class="slides_demo"> <input type="button" @click="gotoSlide()" value="Go" /> </slide> <slide class="slides_demo"> <p>This is next page</p> </slide> </carousel> </div> 之前有一个div，哪个类是“VueCarousel-inner”。它创建了一个包含所有轮播的数组。这就是为什么我必须指定“slider[0]”来定位我的滑块。我在方法中创建的功能会在屏幕旁边自动触发您想要的幻灯片： gotoSlide: function(){ let slider = window.document.getElementsByClassName('VueCarousel-inner'); if (window.innerWidth < 810) { slider[0].style.transform = "translate3d(" + "-" + slider[0].style.flexBasis + ", 0px, 0px)"; } else { slider[0].style.transform = "translate3d(-810px, 0px, 0px)"; } } 它是完全响应的:) 谢谢大家的帮助！

编辑

登录后才能参与评论