jQuery - swiper 웹접근성 준수

erica·2023년 1월 11일
0
<script>
new Swiper('.swiper-container', {
    navigation: {
        nextEl: '.wrap-slide-box .swiper-button-next',
        prevEl: '.wrap-slide-box .swiper-button-prev',
    },
    a11y: {
        prevSlideMessage: '이전 슬라이드',
        nextSlideMessage: '다음 슬라이드',
        slideLabelMessage: '총 {{slidesLength}}장의 슬라이드 중 {{index}}번 슬라이드 입니다.',
    },
})
</script>

출처 : https://pxd-fed-blog.web.app/a11y-swiper-slide/

앞서 swiper option 정리하면서 a11y 의 사용법을 잘 모르겠어서 검색해서 찾은 내용
나는 단순하게 이전/다음 슬라이드 정도의 내용을 넣는 정도만 생각했는데 출처 안에는 swiper 안에서 또 다른 링크가 들어 있을시 웹 접근성을 어떻게 활용해야 하는지 많은 설명이 되어 있다. 차근차근 봐야지

profile
응미씨

0개의 댓글