dev/web

[JS] 점선 테두리 제거 스크립트 분석

재삐신생 2012. 4. 27. 19:17
반응형

IE에서 생기는 A요소와 IMG요소의 점선 테두리가 보기 안좋아서

여러가지 방법으로 처리를 합니다.


CSS도 IE에 특화된

selector-dummy:expression(this.hideFocus=true);


혹은 A요소에 이벤트를 걸어주는

onfocus="this.blur()"


등의 방법이 있었고,

네이년과 구글링을 해보면

function bluring(){

if(event.srcElement.tagName=="A"||event.srcElement.tagName=="IMG") document.body.focus();

}

document.onfocusin=bluring;


이런 코드가 많이 눈에 띈다.


코드를 분석해보자.

일단 onfocusin이벤트는 IE에만 존재한다.(고로, IE에서만 bluring함수가 실행됨)

그리고 event객체 또한 아무것도 받지 않는 함수에선 IE에서만 동작한다. 찍어보면 MSEventObj란다.;;

srcElement도 마찬가지!


쉽게말해, IE에서만 작동하는 코드인데

점선문제부터가 IE이니까, hack으로 사용하는 코드로는 기가 막힌 수준이다!!


하지만 onfocusin이벤트는 IE에서만 존재하는데, 다른 브라우져에선 document객체에 쓸데없는 변수를 만들어주기만 한다.


그래서

if(typeof(document.onfocusin)=='object') document.onfocusin=bluring;

이런식으로 사용을 하는게 맞지 않을까??


뭐 물론, 필자같은 편집증세가 있지 않다면 아무런 문제도 없다! 아님말고~!


반응형

'dev > web' 카테고리의 다른 글

디자인과 컨텐츠의 분리!  (0) 2012.05.10
tr,td align속성 상속현상  (0) 2012.04.30
[HTML] b태그와 strong태그의 차이  (0) 2012.04.26
자바스크립트 리퍼러에 대해서  (0) 2012.04.13
HTML 특수문자 코드표  (0) 2012.04.09