There is a code for scrolling through slides with arrows on the keyboard:

$(document).keydown(function(e) { if (e.keyCode === 37) { // Previous $(".carousel-control-prev").click(); return false; } if (e.keyCode === 39) { // Next $(".carousel-control-next").click(); return false; } });

How can you modify this script so that it works only on the current carousel, and not on all the carousels on the page?

  • add the necessary id carousel and in the selector instead of the class, contact id? - Vyacheslav Danshin
  • and how do you define the current carousel? - Denis Bubnov
  • I did not understand how to identify the current carousel, so I did it through classes - Marina Voronova

1 answer 1

Unfortunately I did not find a more universal solution, I did this:

 $(document).keydown(function(e) { if (e.keyCode === 37) { // Previous $('.js-control-modal-gallery-photos .carousel-control-prev').click(); $('.js-control-photo-gallery .carousel-control-prev').click(); $('.js-control-gallery-team .carousel-control-prev').click(); $('.js-control-gallery-customers .carousel-control-prev').click(); $('.js-control-jobs .carousel-control-prev').click(); $('.js-control-tech-list .carousel-control-prev').click(); return false; } if (e.keyCode === 39) { // Next $('.js-control-modal-gallery-photos .carousel-control-next').click(); $('.js-control-photo-gallery .carousel-control-next').click(); $('.js-control-gallery-team .carousel-control-next').click(); $('.js-control-gallery-customers .carousel-control-next').click(); $('.js-control-jobs .carousel-control-next').click(); $('.js-control-tech-list .carousel-control-next').click(); return false; } });