首页 > 解决方案 > 如何在 OWL CAROUSEL 2 中编辑当前幻灯片?

问题描述

我正在尝试制作一个带有 1 个项目和 250px 分期的 Owl Carousel。我怎样才能找到当前的幻灯片,因为我想让它比左右更大,并且还要增加不透明度。

这是我的代码:

$('.owl-carousel').owlCarousel({
    stagePadding: 250,
    margin: 10,
    items:1,
    center: true,
    loop:true   
});

和 HTML 代码,还有:

<div class="carousel-container">
                <div class="owl-carousel owl-theme ">
                    <div class="section6-item">
                        <img src="../img/slide1.png" alt="" srcset="">
                        <div">
                            <h1></h1>
                            <p></p>
                        </div>
                    </div>
                    <div class="section6-item">
                        <img class="pr-6" src="../img/slide2.png" alt="" srcset="">
                        <div>
                            <h1></h1>
                            <p></p>
                        </div>
                    </div>
                    <div class="section6-item">
                        <img src="../img/slide3.png" alt="" srcset="">
                        <div>
                            <h1></h1>
                            <p></p>
                        </div>
                    </div>
                    <div class="section6-item">
                        <img src="../img/slide4.png" alt="" srcset="">
                        <div>
                            <h1></h1>
                            <p></p>
                        </div>
                    </div>
                </div>
                <div class="nav-arrows">
                    <button class="btn-prev"><i class="fas fa-chevron-left"></i></button>
                    <button class="btn-next"><i class="fas fa-chevron-right"></i></button>
                </div>
            </div>

标签: jqueryowl-carousel

解决方案


推荐阅读