初始化 swiperjs 不工作

你好,Discourse 团队,

我尝试在首页横幅中添加 SwiperJS,但在初始化 Swiper 时失败了。

这是我的初始化代码:

var mySwiper = new Swiper (‘.swiper-container’, {
// 可选参数
direction: ‘horizontal’,
loop: true,
// 如果需要分页
pagination: {
el: ‘.swiper-pagination’,
clickable:true,
},
// 导航箭头
navigation: {
nextEl: ‘.swiper-button-next’,
prevEl: ‘.swiper-button-prev’,
},
})

但 SwiperJS 无法正常工作。

几天前我使用 OwlCarousel 时也遇到了同样的问题。
我想我可能漏掉了什么,但我找不到问题所在。
有人能帮我找出问题吗?谁知道我的错误在哪里?

附注:使用以下流程初始化 Swiper 和 Owl 时,它们都能正常工作,但每次返回后,都需要强制刷新页面才能再次工作。

$(window).on(“load”, function(){
//…
});

这只是一个演示,你需要使用 {{#if displaydiscourseSwiper}},但在 after_header 处测试后,它并未显示。
最好同时使用 CSS,并加载 Swiper 的 CSS 和 JS 库。

哈哈,谢谢,非常喜欢。它看起来很美。:kissing_heart: :kissing_heart: :kissing_heart: