jQuery owl2在没有要循环的项目时删除导航箭头

时间:2019-04-11 06:12:00

标签: javascript jquery carousel owl-carousel

我有以下旋转木马

enter image description here

我想在左侧/右侧没有项目时消失其中一个导航箭头。在上面的屏幕快照示例中,如果我尝试使用左侧箭头,则不会循环播放,因为左侧没有图像,因此箭头不应出现。

这是我当前正在使用的设置

Navigation.Defaults = {
    nav: false,
    navRewind: false,
    navText: [ 'prev', 'next' ],
    navSpeed: false,
    navElement: 'div',
    navContainer: false,
    navContainerClass: 'owl2-nav',
    navClass: [ 'owl2-prev', 'owl2-next' ],
    slideBy: 3,
    dotClass: 'owl2-dot',
    dotsClass: 'owl2-dots',
    dots: true,
    dotsEach: false,
    dotData: false,
    dotsSpeed: false,
    dotsContainer: false,
    controlsClass: 'owl2-controls',
    loop: false,
};

1 个答案:

答案 0 :(得分:-1)

尝试如下所示的CSS。

.owl-nav .owl-prev.disabled,
.owl-nav .owl-next.disabled {
   display: none !important;
}

或者您可以通过此答案https://stackoverflow.com/a/28027976/9695286中的js来做到这一点