• 돌아가기
  • 아래로
  • 위로
  • 목록
  • 댓글
Script

말풍선 투명하게 만들기

오작교 22848

0
<html>
<head>
<script language="JavaScript">
<!--
function alt( msg, _width, _height ){
    var _style = alt_div.style;
    if( msg != null ){
        alt_div.innerHTML = msg;
        _style.visibility = "visible";
        if( _width != null ){
            if( alt_div.offsetWidth > _width ){
                _style.width = _width;
            }
        }
        if( _height != null ){
            if( alt_div.offsetHeight > _height ){
                _style.height = _height;
            }
        }
    }else{
        _style.visibility = "hidden";
    }
}

document.write(
    "<div id=alt_div style=\"" +
    "padding:2;" +
    "border:1 solid #FF7200;" + // 말풍선 테두리 컬러
    "background-color:#F7F7F7;color:#000;" + // 말풍선 테이블 백그라운드컬러 / 폰트컬러
    "position:absolute;" +
    "visibility:hidden;" +
    "overflow:hidden;" +
    "z-index:auto;" +
    "width:auto;" +
    "height:auto;" +
    "filter:alpha(opacity=60);" + // 투명도
    "\"></div>"
);

document.onmousemove = get_xy;
function get_xy(){
    var _style = alt_div.style;
    var x = event.x + document.body.scrollLeft;
    var y = event.y + document.body.scrollTop;
    _style.left = x + 10;
    _style.top = y + 10;
}
//-->
</script>
</head>

<body>
<a href=# onmouseover="alt( '테스트용 말풍선 입니다.<br>말풍선이 생겼나요?<p>생겼으면 말해주세요.' )" onmouseout="alt()">마우스 올려봐요.</a><p>
레이어에 투명도를 주었군요.ㅎㅎ
</body>

</html
공유
0

댓글 쓰기 권한이 없습니다. 로그인

취소 댓글 등록

신고

"님의 댓글"

이 댓글을 신고하시겠습니까?

댓글 삭제

"님의 댓글"

삭제하시겠습니까?

목록

공유

facebooktwitterpinterestbandkakao story
번호 분류 제목 글쓴이 날짜 조회 추천
공지 HTML HTML 기초 다지기 4 오작교 08.06.17.16:26 290871 0
공지 HTML HTML과 CSS의 종합 정리 1 오작교 07.10.01.10:21 349838 0
공지 일반 스타일시트의 총정리 오작교 06.09.14.13:08 294474 +14
300
normal
오작교 23.12.10.09:32 14534 0
299 Script
normal
오작교 23.12.10.09:29 19867 0
298 CSS
normal
오작교 21.01.09.14:18 40798 0
297 HTML
normal
오작교 15.09.17.08:58 116383 0
296 HTML
normal
오작교 15.09.13.21:38 21666 0
295 HTML
normal
오작교 15.09.13.21:30 25247 0
294 HTML
normal
오작교 15.08.30.12:19 52847 0
293 Script
normal
오작교 15.05.12.14:06 21233 0
292 HTML
file
오작교 12.03.08.13:51 36002 0
291 HTML
normal
오작교 11.06.03.10:44 40824 0
290 CSS
normal
오작교 11.06.03.10:29 70725 0
289 Script
normal
오작교 11.03.22.11:19 43533 0
288 Script
normal
오작교 11.03.22.11:15 38303 0
287 Script
normal
오작교 11.03.22.11:07 37190 0
286 HTML
normal
오작교 11.01.25.10:27 36283 0
285 CSS
normal
오작교 11.01.24.10:40 35456 0
284 HTML
normal
오작교 11.01.24.10:39 37175 0
283 Script
normal
오작교 11.01.24.10:34 38185 0
282 CSS
normal
오작교 11.01.24.10:31 37824 0
281 CSS
normal
오작교 11.01.24.10:27 36286 0