Slider or Carousel Custom Button with Elementor

Slider or Carousel Custom Button with Elementor
Slider or Carousel Custom Button with Elementor

JavaScript code snippet for Left/Right Navigation:

				
					<script data-minify="1" src="https://mojibur.com/wp-content/cache/min/1/jquery-3.6.0.min.js?ver=1731166159" data-rocket-defer defer></script>
<script>window.addEventListener('DOMContentLoaded', function() {
var $ = jQuery
$(document).ready(function(){
    
    $('.card-carousel .card-prev').on('click', function(){
        
        $(this).closest('.card-carousel').find('.elementor-swiper-button-prev').trigger('click')
        $(this).closest('.card-carousel').find('.swiper-container').trigger('mouseleave')
    })
    
    $('.card-carousel .card-next').on('click', function(){
        $(this).closest('.card-carousel').find('.elementor-swiper-button-next').trigger('click')
        $(this).closest('.card-carousel').find('.swiper-container').trigger('mouseleave')
    })
    
    $('.card-carousel .card-prev a, .card-carousel .card-next a').on('click', function(e){
        e.preventDefault()
    })
})
});</script>
				
			

Top section class

card-carousel

Next button class

card-next

Prev button class

card-prev

Leave a Reply

Your email address will not be published. Required fields are marked *

Latest tutorials

Freelancer Mojibur
freelancer mojibur

Start a Project!

Interested in working together? Send a quick message or schedule a meeting. Ask questions, discuss details, and decide if we are a good fit.

Website Project Inquiry

This form helps me get a general idea. We’ll schedule a meeting soon to discuss everything in more detail!

Freelancer Mojibur

Contact person

For quick communication email at: freelancermojibur@gmail.com