스와이퍼 웹 접근성 tab키

스와이퍼 웹 접근성 tab키

QA

스와이퍼 웹 접근성 tab키

본문

[웹 접근성]

 

키보드 탭 키를 통해 링크 포커스를 이동시킬 때, 다른 곳은 잘 작동하는데 스와이퍼 영역에서 탭 키를 반복해서 눌러도 링크 포커스가 스와이퍼를 벗어나지 못하고 내부 슬라이더에서 무한으로 탭 키가 이동하는 문제를 겪고 있습니다. ㅠㅠ 

 


// html 
 
<slide>
     <button type = "button">  // 계속 포커스 되는 요소
    <button type = "button">
<slide>
 
 
// js
  var swiper = new Swiper(".mainSwiper", {
   
    slidesPerView : 'auto', 
    centeredSlides: false,
    slidesBetWeen : 16,
 
    loop: true,
    loopAdditionalSlides : 1,
 
    autoplay: {
    delay: 3000,
    },

 

이 질문에 댓글 쓰기 :

답변 1

loop를 풀어서 해결하거나 자바스크립트를 통해 직접 구현하셔야 합니다.
- Tab 키를 눌러 swiper 슬라이드의 마지막 객체에 포커스가 발생했을때 다음 객체로 포커스 이동

 

swiper가 loop일 경우 복제된 슬라이드의 마지막으로 포커스가 설정됩니다.

 

swiper 플러그인 자체에서 해결하지 않는 문제로 이미 해외에서도 많이 제보 & 이슈가 된 문제입니다.


참고 : https://stackoverflow.com/questions/76623766/using-swiperjs-how-to-keyboard-tab-through-active-slide-only

 

stackoverflow 뿐만 아니라 해외 여러 개발자 커뮤니티와 swiper 깃허브에 수 차례 제보 되었지만

 

제작자 쪽에서는 보완할 생각이 없어 보입니다.

잘 해결되시면 채택 한번 부탁드립니다^^

답변을 작성하시기 전에 로그인 해주세요.
전체 33
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT