如何解决Swiperjs 子弹和箭头不来了 - Svelte, Sapper
我正在尝试向 svelte (Sapper) 项目中的 Swiper 幻灯片添加项目符号和导航按钮。我已经为 svelte 使用了 Swiperjs 实现。滑块工作正常,但导航按钮和项目符号不起作用。请帮忙。
<style>
:global(.swiper-pagination-bullet) {
background-color: #fbd38d !important;
border-color: #fbd38d !important;
}
:global(.swiper-pagination-bullet-active) {
background-color: #dd6b20 !important;
border-color: #dd6b20 !important;
}
:global(.swiper-button-next) {
background-color: #fbd38d !important;
border-color: #fbd38d !important;
}
:global(.swiper-button-prev) {
background-color: #fbd38d !important;
border-color: #fbd38d !important;
}
:global(.swiper-slide) {
align-self: stretch;
height:auto
}
</style>
<div class="w-full bg-orange-200">
{#if isMounted}
<Swiper
spaceBetween={10}
slidesPerView={1}
observer={true}
navigation = {{ nextEl: '.swiper-button-next',prevEl: '.swiper-button-prev' }}
pagination = {{
clickable: true,el: {id},type: 'bullets'
}}>
{#each data as testimonial,i}
<SwiperSlide>
<div class="py-1 h-full bg-orange-200">
<MySlide />
</div>
</SwiperSlide>
{/each}
</Swiper>
{/if}
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。