레이어팝업 띄우고 포커스 레이어팝업으로 이동시키기

웹접근성 인증마크를 획득하지 않더라도 기본적으로 표준을 준비하는것이 좋다.

신규구축에는 인증마크 획득 이슈가 없더라도 구축이 완료된 후에 따로 재의뢰가 들어오는 경우도 있기때문이다.  

이런 경우를 가끔 겪다보니 이제는 표준을 준수하면서 코딩을 해나가고 있다. 

요즘은 디자이너 또는 고객사의 요청으로 윈도우팝업보다는 레이어팝업이 더욱 많이 이용되고 있는것이 현실이고 이에 대응하기 위해서 레이어팝업을 띄우면 탭으로 포커스 이동시 바로 팝업으로 향해야된다. 오늘은 그 방법을 알아보도록 하자.

var $this;
 
$(".btn").click(function(){
 
    $(".layerPop1").attr("tabindex", 0).show().focus();
 
    $this = $(this);
 
$(".popClose").click(function(){
 
    $(".layerPop1").css("display", "none");
 
    $(".blackBg").fadeOut(0);
 
    $this.find("a").focus();
 
});

어려운 소스가 아니기에 몇번 보면 이해가 되겠지만 설명을 덧붙이자면, $this 변수에 내가 클릭한 this를 담아주고 팝업의 x버튼을 누를때 담아두었던 $this로 포커스가 이동한다.