custom swiper slider not working (pasting in console works)

  • Resolved Altaf Hussain Patel

    (@altafhpatel)


    2 years, 1 month ago

    Have a div with id ‘#yatra_swiper_slider’ when i write the code in console

    var swiper = new Swiper('#yatra_swiper_slider', {
    slidesPerView: 1,
    autoplay: true,

    breakpoints: {
      640: {
        slidesPerView: 1,
        spaceBetween: 15,
      },
      768: {
        slidesPerView: 2,
        spaceBetween: 15,
      },
      1024: {
        slidesPerView: 4,
        spaceBetween: 15,
      },
    },

    pagination: {
      el: '.swiper-pagination',
      clickable: true,
    },

    navigation: {
      nextEl: '.swiper-button-next',
      prevEl: '.swiper-button-prev',
    },

  });

    pasting this code in console works and slider start working… but when i write this code in footer.php it says swiper is not defined….

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi,

    Unfortunately, We are limited in supporting issues that arise due to the use of custom code.

    However, we invite you to join the Elementor Forum where you can find a supportive and helpful community of experienced users that are happy to provide useful tips and tricks.

    Tamal S

    (@tamalsen)

    Hi Altaf,
    I have faced a similar problem. Try wrapping your code inside the following block:

    
$(window).on('elementor/frontend/init', function () {
    // wait for elementor pro to load
    elementorFrontend.on('components:init', function () {

// Insert your code here
    });
});
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘custom swiper slider not working (pasting in console works)’ is closed to new replies.