Reply To: Xtemos image gallery

Thank you for the video. Now we see that there is some bug in this option in OWL Carousel JS library. It happens on their demo as well https://owlcarousel2.github.io/OwlCarousel2/demos/autoplay.html
We can suggest you to use their “Stop on hover” option. You can enable it with the following code snippet

function basel_owl_carousel_init( $atts = array() ) {
        extract( shortcode_atts( basel_get_owl_atts(), $atts ) );

        $func_name = 'carousel_' . $carousel_id;
        $func_name = function() use( $carousel_id, $slides_per_view, $autoplay, $autoheight, $speed, $hide_pagination_control, $hide_prev_next_buttons, $scroll_per_page, $wrap ) {
            
            $items = array();
            $items['desktop'] = ($slides_per_view > 0) ? $slides_per_view : 1;
            $items['desktop_small'] = ($items['desktop'] > 1) ? $items['desktop'] - 1 : 1;
            $items['tablet'] = ($items['desktop_small'] > 1) ? $items['desktop_small'] : 1;
            $items['mobile'] = ($items['tablet'] > 2) ? $items['tablet'] - 2 : 1;

            if($items['mobile'] > 2) {
                $items['mobile'] = 2;
            }

            ?>

            <script type="text/javascript">
                jQuery( document ).ready(function( $ ) {

                    var owl = $("#<?php echo esc_js( $carousel_id ); ?> .owl-carousel");

                    $( window ).bind( "vc_js", function() {
                        owl.trigger('refresh.owl.carousel');
                    } );

                    var options = {
                        rtl: $('body').hasClass('rtl'),
                        items: <?php echo esc_js( $items['desktop'] ); ?>, 
                        responsive: {
                            979: {
                                items: <?php echo esc_js( $items['desktop'] ); ?>
                            },
                            768: {
                                items: <?php echo esc_js( $items['desktop_small'] ); ?>
                            },
                            479: {
                                items: <?php echo esc_js( $items['tablet'] ); ?>
                            },
                            0: {
                                items: <?php echo esc_js( $items['mobile'] ); ?>
                            }
                        },
                        autoplay: <?php echo ($autoplay == 'yes') ? 'true' : 'false'; ?>,
                        autoplayTimeout: <?php echo $speed; ?>,
                        autoplayHoverPause: true,
                        dots: <?php echo ($hide_pagination_control == 'yes') ? 'false' : 'true'; ?>,
                        nav: <?php echo ($hide_prev_next_buttons == 'yes') ? 'false' : 'true'; ?>,
                        autoheight: <?php echo ($autoheight == 'yes') ? 'false' : 'true'; ?>,
                        slideBy:  <?php echo ($scroll_per_page == 'yes') ? '\'page\'' : 1; ?>,
                        navText:false,
                        loop: <?php echo ($wrap == 'yes') ? 'true' : 'false'; ?>,
                        onRefreshed: function() {
                            $(window).resize();
                        }
                    };

                    owl.owlCarousel(options);

                });
            </script>

            <?php
        };

        if( $carousel_js_inline == 'yes' ) {
            $func_name();
        } else {
            add_action( 'basel_after_footer', $func_name );
        }
    }