Question

使用在ltr中工作正常的光滑方向但在阿拉伯语语言环境中我的方向是rlt，其中slick-lightbox为空并且没有显示任何内容。

我在rtl案例中搜索并找到slick的解决方案但找不到slick-lightbox的任何解决方案。

Answer 1

我是通过改变slick.js中的方向来完成的。

在slick.js中有一个.slide { position: relative; border: 3px black inset; padding: 3px; width: auto; overflow: hidden; } .slide div:first-child { position: absolute; width: 100%; height: 100%; background: url(wood.jpg) repeat-x; left: 0%; top: 0%; animation-duration: 2s; animation-delay: 250ms; animation-fill-mode: forwards; animation-timing-function: cubic-bezier(.33,.99,1,1); } @keyframes slider { to {left: 100%;} } @keyframes slider-restart { to {left: 0%;} }方法。在那里我添加function Slick(element, settings)

rtl:true

通过这种改变可行。

Answer 2

只想给出一个明确的答案：有一种方法可以将选项传递给轮播，您可以像这样通过它：

$('.images-container').slickLightbox({
    navigateByKeyboard  : true,
    useHistoryApi: true,
    slick: {
       rtl: true
    }
});

欢呼声

Answer 3

如果在CSS中使用direction:rtl时滑块不起作用您应该在HTML的脚本标签中使用此代码

$(document).ready(function () {
    $('.slider').slick({
        dots: true,
        arrows: false,
        autoplay: true,
        autoplaySpeed: 3000,
        rtl:true
    });
});

光滑的灯箱不能在rtl方向工作

3 个答案: