如何idangerous swiper方向rtl与jquery在wp?我检查了所有相关的来源,但不幸的是没有提供解决方案请帮助,如果你可以,旋转的方向从左到右
我的代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
<link href="<?php bloginfo('template_directory'); ?>/css/swiper-bundle.min.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="swiper-container" dir="rtl">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
<div class="swiper-slide">Slide 7</div>
<div class="swiper-slide">Slide 8</div>
<div class="swiper-slide">Slide 9</div>
<div class="swiper-slide">Slide 10</div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-button-next"></div>
</div>
<script src="<?php bloginfo('template_directory'); ?>/js/idangerous.swiper.min.js"></script>
<script>
$(document).ready(function () {
var mySwiper = new Swiper('.swiper-container', {
slidesPerView: "auto",
spaceBetween: 30,
})
jQuery('.swiper-button-prev').on('click', function (e) {
e.preventDefault()
mySwiper.swipePrev()
})
jQuery('.swiper-button-next').on('click', function (e) {
e.preventDefault()
mySwiper.swipeNext()
})
})
</script>
</body>
</html>
1条答案
按热度按时间eit6fx6z1#
尝试将reverseDirection设置为true来初始化Swiper
https://swiperjs.com/swiper-api#param-autoplay-reverseDirection