【问题标题】:owl-carousel not working in responsive modeowl-carousel 在响应模式下不工作
【发布时间】:2017-01-25 01:27:27
【问题描述】:

我在一个网站上安装了 owl - 在桌面模式下完美运行,但在移动模式下,幻灯片似乎完全消失了。

我的站点位于:ypt.co.il(大型主滑块下方的 4 个块 - 在桌面模式下首先显示)。

这是插件代码:

    $('.owl-carousel').owlCarousel({
        loop:true,
        margin:27,
        nav:true,
        responsive:{
            0:{
                items:1
            },
            600:{
                items:3
            },
            992:{
                items:4
            }
        }
    });

任何意见表示赞赏!

【问题讨论】:

  • responsiveClass:true,

标签: jquery-plugins owl-carousel


【解决方案1】:

由于以下情况,您的轮播未在移动设备中配置。 检查您拨打res()的情况@

if(!$('.toggleMenu').is(':visible')){
  res();
}

如果条件将在移动设备中返回 false,在桌面设备中返回 true。这就是您的轮播没有初始化的原因。

你必须在移动端和桌面端都初始化你的轮播,所以你可以在页面加载后直接调用res()

$(function () {
  res();
});

它可以工作,我已经通过修改你的js文件在你的网站上进行了测试。

【讨论】:

  • 这里的 res() 是什么?
  • res() 是@kneidels 绑定猫头鹰轮播的函数。基本上 $('.owl-carousel').owlCarousel({}) 存在于 res();你可以通过调试在他的网站上查看。
猜你喜欢
  • 1970-01-01
  • 2020-09-02
  • 2023-02-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-05-31
  • 1970-01-01
相关资源
最近更新 更多