HTC를 활용한 링크 포커스 없애기(한번에 점선없애기)

먼저 소스를 보기전에 HTC에 대해 잠시 소개를 하고 넘어가도록 하지요. 우선 HTC는 스크립트에서 DHTML behaviors에 권한을 부여하는 간단한 메카니즘을 제공하것으로 HTC는 HTML파일과는 다르게 .htc 확장자로 저장되며 내용에는 스크립트와 HTC고유의 구성요소와 속성, 메쏘드, 이벤트 등이 들어가지요.

뭔소리가 하면 페이지내의 모든 요소에 DHTML로서 스크립트 가능 권한을 부여한다는 이야기지요. HTC파일 내부의 모든 HTC 요소는 id속성을 사용하는 모든 개체와 동일하게 스크립트에서 접근이 가능하다는 뜻입니다. 달리말하면 HTC 요소의 모든 속성과 메쏘드들은 스크립트를 통하여 HTML에서 ID를 사용하는 개체의 속성과 메쏘드로서 동적 연결이 가능하다는 이야기입니다.

말이 많이 어렵지요? 자바스크립트 부분에서 개체생성 부분까지 어느 정도
공부를 하셔야 이해가 쉬울듯 합니다.

그럼 소개를 대충 마치고 코드를 보도록 하지요.

<PUBLIC:ATTACH EVENT="onfocus" ONEVENT="link_focus()" />
<SCRIPT LANGUAGE="JScript">
function link_focus(){window.event.srcElement.blur()}
</SCRIPT>

위 부분은 위에서 말씀드린 htc파일로 저장될 부분이지요.
link.htc로 저장을 하지요.(이름은 아무거나 저장해도 됩니다.)

다음 문서에서 위 htc를 css에서 behavior메쏘드로 불러옵니다.

<style>a{behavior:url(link.htc);}</style>

이렇게 하면 모든 링크에 포커스가 생기는 것을 막아주지요.

코드 설명을 잠시드리면

위는 htc개체중의 하나지요.. 이벤트를 잡아오는 잡는 역을 하지요.
포커스발생 이벤트를 감지하여 link_focus 함수(프로시저)를 불러옵니다.

아래는 스크립트 부분입니다. 위에서 호출하는 link_focus를 정의하는 부분이지요
<SCRIPT LANGUAGE="JScript">
function link_focus(){window.event.srcElement.blur()}
</SCRIPT>

window.event.srcElement.blur()
위 식은 윈도우에서 이벤트를 발생시킨 요소의 포커스를 없애는 식입니다.

참고로 neom4 스킨의 플레이어를 드래그하여 위치를 이동시키는 스크립트 역시 htc를 이용하여 만들어진 것입니다.

소개글과 지금 알려드린 부분을 연관하여 전체적인 설명을 드리면
htc라는 것은 일반 자바스크립트처럼 id를 정해서 어느 하나의 개체에
적용하는 것이 아니라 이처럼 htc를 behavior로 지정한 모든 html의
구성요소는 htc내부에서 id로 지정한 것처럼 개체로 인식하고 a태그로
지정한 것처럼 여러개의 링크가 존재할 경우 그 엘리먼트에 대한 모든
속성과 메쏘드를 복제하여 각 엘리먼트에 적용하지요.

어려우셔도 더 자세히 설명드릴 방도가 없네요. 더 자세히 알고 싶으시면
마소 MSDN 문서를 참고하시는 것이 좋습니다. 영어라 좀더 의미전달이
제가 한 것 보다는 정확할 것입니다.
(HTC의 개체, 속성, 메쏘드, 이벤트 등은 자바스크립트 고급 수준은 정도는 되어야 어느정도 내용 이해가 가능하므로 강좌계획은 아직 없습니다.)

앞으로의 dhtml은 wsc, htc를 얼마나 잘 활용하느가가 중요한 관건이 되리라 생각됩니다. 외국사이트(소스제공사이트 아님, 개발자사이트, 포럼 등)에 보면 최신 DHTML소스들은 모드 HTC와 WSC를 활용한 것을 보아도 알수 있을 겁니다. 자바스크립트를 어느정도 익히셨으면 좀더 심도있는 DHTML을 익히실려면 공부해보시는 것도 좋을 것 같습니다.

출처
Name : Legend Homepage : http://neom.new21.net

아래 스크립트를 우선 link.htc로 저장을 하고 계정에
업로드 합니다.

<PUBLIC:ATTACH EVENT="onfocus" ONEVENT="link_focus()" />
<SCRIPT LANGUAGE="JScript">
function link_focus(){window.event.srcElement.blur()}
</SCRIPT>

그런다음 아래와 같이 해주시면 됩니다..
<style>
a{behavior:url(link.htc);}
</style>

펌 : http://seobangnim.com/zbxe/1817