Есть на странице Swiper, внутри контейнера лежит список со слайдами
<li class="product__item swiper-slide">
<a href="product.html">
<figure>
<picture>
<!-- 1x: 270 ; 2x: 540 -->
<source type="image/webp" srcset="img/catalog-img/marble-earrings-desktop.webp 1x, img/catalog-img/marble-earrings-desktop@2x.webp 2x">
<img loading="lazy" src="img/catalog-img/marble-earrings-desktop.jpg" srcset="img/catalog-img/marble-earrings-desktop@2x.jpg 2x" width="270" height="284" alt="silver earrings with a marble stone">
</picture>
<p>Marble earrings</p>
<p>$ 95</p>
</figure>
</a>
</li>
Таких слайдов 15, в контейнер умещается 4. Если табом идти по странице и дойти до свайпера, то он начинает листать эти слайды из за ссылки внутри, чего не хотелось бы... Как при помощи документации решить данную задачу? Есть идея, чтобы на неактивные слайды вешать tabindex='-1'
, но активными он считает почему то только первый слайд в контейнере