0
Searching answer

Add a play/pause button on Slider

Brian 2 years ago updated by Andrei S. (Developer) 2 years ago 1

Dears, 

For Web Accessibility Recognition, can you teach me to add a play or pause button, I found some code for your reference.

// Play/pause button on slider
jQuery( document ).ready(function($) {
var playButton = '.play-button';
var pauseButton = '.pause-button';
var current = '.current';
var sliderDiv = '#swiper-wrapper';

$(pauseButton).hide();
$(playButton).hide();

jQuery( sliderDiv ).mouseenter(function() {

jQuery(current).show();

jQuery(pauseButton).click(function() {
jQuery(this).hide().removeClass( "current" );
jQuery(playButton).show().addClass( "current" );
});
jQuery(playButton).click(function() {
jQuery(this).hide().removeClass( "current" );
jQuery(pauseButton).show().addClass( "current" );
});
});
jQuery( sliderDiv ).mouseleave(function() {
$(pauseButton).hide();
$(playButton).hide();
});
});

Searching answer

Hello

It is not easy to do.

You should create a Swiper slider with buttons and then add custom JS with the proper slider selector. 

--

Best Regards

Andrei S.