|
마우스 떼시면 서서히 사라지는 툴팁입니다.
|
|
글자색 글자크기 트랜지션속도등 원하는 스타일에 맞게 수정해서 사용하세요 |
<style>
<!--
.square {font-size:9pt; font-family:돋움; color:white;
border:1 black solid;background:#383838; padding:5;}
-->
</style>
<script language="JavaScript">
<!--
var n = (document.layers)
? 1:0;
var ie = (document.all) ? 1:0;
function mouseover(squareObj) {
if
(ie) {
squareObj.style.visibility = "visible";
squareObj.filters.item(0).stop();
}
}
function mouseout(squareObj) {
if (ie) {
squareObj.style.visibility
= "visible";
squareObj.filters.item(0).transition = 12;
//트랜지션 번호
squareObj.filters.item(0).apply();
squareObj.style.visibility
= "hidden";
squareObj.filters.item(0).play();
}
}
//-->
</script>
<span onMouseOver="mouseover(tool)" onMouseOut="mouseout(tool)"><a
href="#">글</a></span>
<div id="tool"
class="square" style="width:200px; height:25px; position:absolute;
left:50px; top:50px; z-index:10; visibility:hidden; filter:revealTrans(duration=1);">내용</div>
font-size : 글자크기
font-family : 글꼴
color : 글자색
border : 툴팁 테두리의 두께, 색깔, 종류
background : 배경색
padding :
내부 여백
width : 너비
height : 높이
left : 왼쪽 위치
top :
위쪽 위치
duration : 트랜지션 속도