Owl Carousel 2 - Spinner Loader за изображениями - PullRequest
Новая
       12

Owl Carousel 2 - Spinner Loader за изображениями

0 голосов
/ 05 апреля 2020

У меня странное поведение с загрузчиком, который показывается за изображениями, но ленивая загрузка объявляется как false в опциях. 

$('.galleryowl').owlCarousel({
    margin: 10,
    autoWidth: true,
    dots: false,
    dotsEach: false,
    lazyLoad: false,
    loop: false
});

enter image description here

Есть ли у вас какие-либо подсказки, которые могут быть проблемой?

С уважением 

<div class="galleryowl owl-carousel owl-theme owl-loaded owl-drag">
    <div class="owl-stage-outer">
        <div class="owl-stage"
            style="transform: translate3d(-615px, 0px, 0px); transition: all 0.25s ease 0s; width: 2255px;">
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966999.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17967002.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966992.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item active" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966994.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item active" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966997.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item active" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966995.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item active" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17967011.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966998.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966990.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966984.jpg"
                    style="opacity: 1;"></div>
            <div class="owl-item" style="width: auto; margin-right: 10px;"><img class="img-responsive"
                    src="https://66822b0c4798708fd342-4c20877d1724d8eec18944c33f4c4dbd.ssl.cf1.rackcdn.com/17727/1386208/medium/17966991.jpg"
                    style="opacity: 1;"></div>
        </div>
    </div>
    <div class="owl-nav disabled"><button type="button" role="presentation" class="owl-prev"><span
                aria-label="Previous">‹</span></button><button type="button" role="presentation" class="owl-next"><span
                aria-label="Next">›</span></button></div>
    <div class="owl-dots disabled"></div>
</div>

Ответы [ 2 ]

0 голосов
/ 05 апреля 2020

Это была проблема в моем файле css owl. Я удалил фоновую картинку, которая была загружена по ошибке.

0 голосов
/ 05 апреля 2020

Вы можете настроить его на скрипку, чтобы мы могли на него посмотреть, поскольку сейчас трудно сказать, почему.

Одним из быстрых решений может быть скрытие загрузчика с помощью css.

...