Slider automat - JS

Limbaje de Programare JavaScript / Node
1

Salut, am un slider cu 2 imagini pe prima pagina, se schimba automat dupa 15 secunde si ai si sageti in stanga/dreapta sa schimbi tu daca vrei.

Problema e ca indiferent de ce as face/apasa, nu mai se schimba imaginea deloc, nici automat nici din buton. In consola nu am nici o eroare, nu stiu ce as putea verifica…

Ce elemente de CSS ar putea bloca un astfel de slider sa se manifeste?

Slider-ul de pe prima pagina este acesta: Makali || Home - Organic
Nu stiu ce am stricat, ca nu se mai schimba…

Merci mult.

2

Am văzut de unde ai luat slider-ul. E totul ok acolo. Acum să vedem și ce ai tu. Altfel nu te poate ajuta nimeni.

3

Ok, multumesc mult pt interes.
Eu am asta:

<div class="slider-area slider-style-two">
    <!-- Slider Area Start Here -->
    <div class="slider-activation owl-carousel without-dots">
        <!-- Start Single Slide -->
        <div class="slide align-center-left animation-style-01 bg-image-35">
            <div class="overlay"></div>
            <div class="slider-progress"></div>
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="slider-content">
                            <h3>What is play and what is its purpose?</h3>
                            <p class="short-desc">Self produced garlic, slices - quality assurance, reasonable price</p>
                            <div class="slide-btn makali-btn transparent-btn">
                                <a href="shop.html">Shop Now</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- End Single Slide -->
        <!-- Start Single Slide -->
        <div class="slide align-center-left animation-style-02 bg-image-36">
            <div class="overlay"></div>
            <div class="slider-progress"></div>
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="slider-content">
                            <h1>Organic Food</h1>
                            <h2>Freash Natural</h2>
                            <p class="short-desc">Is the product of a farming system wich avoids the use of man-made fertilisers </p>
                            <div class="slide-btn makali-btn transparent-btn">
                                <a href="shop.html">Shop Now</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- End Single Slide -->
    </div>
    <!-- Slider Area End Here -->
</div>
4

Nu e suficient. Codul pe care l-ai postat îl găsesc în exemple (puțin modificat). Eu, cel puțin, am nevoie să-l văd în acțiune, chiar dacă nu e funcțional.

Ce văd în codul tău în plus este <div class="overlay"></div>, dar nu e musai și să fie problema de acolo.

Deci, vino cu un link.

5

Ok, ce cod? In index am:

@section('content-wrapper')
    @include('shop::home.slider')
@endsection

In acest folder se gaseste doar codul de mai sus, am socs tot, am lasat doar slider-ul pe pagina crezand ca e dela alte elemente dar degeaba.
In rest am script-ul Owl Carousel v2.2.1 as putea sa-l las aici daca e nevoie.

6

probabil codul de aici.

Ca vad ca incluzi componente. Ce este cu inspect element este codul pe care il primeste browser-ul si nu neaparat ce scrii tu. Asta daca folosesti un framework web ca Vue, React etc

7

Asta l-ai pus in javascript ?

$(".slider-activation").owlCarousel({
    loop: true,
    margin: 0,
    nav: true,
    autoplay: true,
    animateOut: 'fadeOut',
    animateIn: 'fadeIn',
    items: 1,
    autoplayTimeout: 10000,
    navText: ["<i class='fa fa-angle-left'></i>", "<i class='fa fa-angle-right'></i>"],
    dots: true,
    autoHeight: true,
    lazyLoad: true
});
8

L-am pus mai sus, sunt acele div-uri.

9

L-am pus acum, dar fara succes…