«   2022/01   »
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          
Archives
Today
62
Total
864,818
관리 메뉴

래빗 크리스

스타일시트 CSS 명칭이 text-decoration 처럼 중간에 하이픈이 들어가면 자바스크립트로 어떻게 다룰까 본문

2. 컴퓨터 이야기/소프트웨어

스타일시트 CSS 명칭이 text-decoration 처럼 중간에 하이픈이 들어가면 자바스크립트로 어떻게 다룰까

래빗 크리스 2009. 5. 25. 16:55

만약 '즐거운 하루.. ~.~' 라는 텍스트 위에 마우스 커서가 올려질 때 밑줄이 그어지고,
마우스 커서가 다른 곳으로 이동할때 다시 밑줄이 없어지게 하려면 어떻게 해야 할까..?
스타일 시트를 사용하면 되겠는데.. 이렇게 해 볼까..?

<span style="text-decoration:uderline">즐거운 하루.. ~.~ </span>

위와 같이 하면, 밑줄은 그려지는데.. 마우스가 다른 곳으로 이동할때도 밑줄이 그대로 있다.. ㅠ
역시 자바스크립트를 사용해야 한다.
그런데, 하이픈이 들어간 명칭을 자바스크립트로 처리하려면 어떻게 해야 할까..?

<span onMouseOver="function1(this)" onMouseOut="function2(this)">즐거운 하루.. ~.~ </span>
<script language="JavaScript">
<!--
function function1(o){
  o.style.text-decoration = 'uderline';
}

function function2(o){
  o.style.text-decoration = 'none';
}
//-->
</script>

위와 같이 하면, 대략 난감해 진다.. ㅠㅠ
그렇다.. 정답은, 하이픈 뒤의 첫 알파벳을 대문자로 하고, 하이픈은 지우는 것.

<span onMouseOver="function1(this)" onMouseOut="function2(this)">즐거운 하루.. ~.~ </span>
<script language="JavaScript">
<!--
function function1(o){
 o.style.textDecoration = 'underline';
}
function function2(o){
 o.style.textDecoration = 'none';
}
//-->
</script>

이제는 정상적으로 작동을 한다. .ㅠ
0 Comments
댓글쓰기 폼