컴

마우스 오버 위치에 따라 툴팁 생성 및 자동 이동

· 2014-09-18 (목) 12:36:35 · 5476

<script src="js/jquery-1.8.3.min.js" type="text/javascript"></script>

<script>

$(function(){

$("span.tooltip").css({

   opacity:"0.9",

   position:"absolute",

   display:"none"

});

 

$("a").mouseover(function(){

   $("span.tooltip").fadeIn();

}).mouseout(function(){

   $("span.tooltip").fadeOut();

}).mousemove(function(e){

   $("span.tooltip").css({

"top":e.pageY+10+"px",

"left":e.pageX+10+"px"

   });

});

});

</script>

 

<a href="http://ascii.jp/elem/000/000/438/438206/">tooltip sample</a> <span class="tooltip">툴팁 내용<br /><strong>

 

 

주황색으로 된 부분이 툴팁 나오게 하는 부분이고요.

검정색 박스가 팁이에요.

e라는 부분이 툴팁을 자동으로 이동시키는 부분이에요.  

 

마우스 오버 이벤트에서 마우스에 좌표를 가져와요.

 

|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
14-09-19 조회 3,688
14-09-19 조회 3,960
14-09-19 조회 4,326
14-09-19 조회 3,978
14-09-19 조회 4,417
14-09-19 조회 3,908
14-09-19 조회 4,060
14-09-19 조회 4,191
14-09-19 조회 3,929
14-09-19 조회 3,976
14-09-19 조회 4,045
14-09-19 조회 4,984
14-09-19 조회 3,956
14-09-18 조회 4,027
14-09-18 조회 3,867
14-09-18 조회 4,149
14-09-18 조회 3,989
14-09-18 조회 3,663
14-09-18 조회 4,258
14-09-18 조회 4,549
14-09-18 조회 4,229
14-09-18 조회 4,050
14-09-18 조회 4,240
14-09-18 조회 4,935
14-09-18 조회 4,083
14-09-18 조회 4,052
14-09-18 조회 5,477
14-09-18 조회 5,366
14-09-18 조회 4,175
14-09-18 조회 4,671
14-09-18 조회 4,269
14-09-18 조회 4,071
14-09-18 조회 4,282
14-09-18 조회 4,886
14-09-17 조회 4,049
14-09-16 조회 4,851
14-09-16 조회 5,071
14-09-16 조회 3,769
14-09-15 조회 3,973
14-09-15 조회 3,546
14-09-13 조회 4,630
14-09-12 조회 4,446
14-09-12 조회 3,829
14-09-12 조회 3,721
14-09-11 조회 3,437
14-09-11 조회 4,256
14-09-11 조회 4,546
14-09-10 조회 3,365
14-09-10 조회 3,545
14-09-03 조회 3,766
14-09-03 조회 3,706
14-09-03 조회 3,957
14-09-03 조회 5,623
14-09-01 조회 5,394
14-09-01 조회 4,821
14-09-01 조회 4,259
14-08-30 조회 4,278
14-08-30 조회 5,546
14-08-29 조회 4,497
14-08-28 조회 5,932
14-08-28 조회 6,581
14-08-28 조회 6,825
14-08-27 조회 6,857
14-08-27 조회 7,016
14-08-27 조회 5,526
14-08-27 조회 2만
14-08-27 조회 4,182
14-08-26 조회 4,221
14-08-26 조회 4,152
14-08-26 조회 4,034
14-08-26 조회 3,989
14-08-26 조회 3,811
14-08-26 조회 3,685
14-08-26 조회 4,297
14-08-26 조회 4,005
14-08-26 조회 3,923
14-08-26 조회 4,129
14-08-26 조회 3,959
14-08-26 조회 3,789
14-08-26 조회 4,001
14-08-26 조회 4,103
14-08-26 조회 4,100
14-08-26 조회 3,976
14-08-26 조회 3,862
14-08-26 조회 3,823
14-08-26 조회 4,092
14-08-26 조회 3,713
14-08-26 조회 3,848
14-08-26 조회 3,635
14-08-26 조회 3,476
14-08-26 조회 3,767
14-08-26 조회 4,363
14-08-26 조회 3,632
14-08-26 조회 3,799
14-08-26 조회 3,731
14-08-26 조회 3,564
14-08-26 조회 3,742
14-08-26 조회 3,651
14-08-26 조회 3,872
14-08-26 조회 4,354