이전
목록
다음
컴

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

잘살아보자
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 · 2014-09-18 (목) 12:36:35 · 5467

<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라는 부분이 툴팁을 자동으로 이동시키는 부분이에요.  

 

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

 

#개발자팁 #개발자 #팁자료실 #jquery
|
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
태그 필터 (최대 3개) 전체 개발자 소스 기타 mysql 팁자료실 javascript php linux flash 정규표현식 jquery node.js mobile 웹서버 os 프로그램 강좌 썸네일 이미지관련 도로명주소 그누보드5 기획자 견적서 계약서 기획서 마케팅 제안서 seo 통계 서식 통계자료 퍼블리셔 html css 반응형 웹접근성 퍼블리싱 표준화 반응형웹 홈페이지기초 부트스트랩 angularjs 포럼 스크린리더 센스리더 개발자톡 개발자팁 퍼블리셔톡 퍼블리셔팁 기획자톡 기획자팁 프로그램강좌 퍼블리싱강좌
+
제목 글쓴이 날짜 조회
16-06-03 조회 3,005
15-07-30 조회 3,402
15-06-08 조회 5,545
15-05-27 조회 4,404
15-01-08 조회 6,697
14-12-30 조회 5,432
14-10-10 조회 5,423
14-08-13 조회 6,341
14-08-11 조회 5,197
14-08-06 조회 6,528
14-03-19 조회 7,425
13-04-26 조회 9,584
12-12-15 조회 5,103
12-12-15 조회 7,337
12-12-11 조회 5,472
12-11-21 조회 6,005
12-10-11 조회 5,087
12-10-03 조회 4,781
12-09-20 조회 6,079
12-09-02 조회 4,262
12-08-29 조회 5,255
12-08-29 조회 4,144
12-08-24 조회 4,242
12-08-18 조회 4,473
12-08-17 조회 4,509
12-08-16 조회 3,766
12-08-06 조회 5,542
12-08-05 조회 4,833
12-08-03 조회 4,547
12-08-03 조회 4,690
12-07-29 조회 3,550
12-07-24 조회 4,137
12-07-22 조회 3,608
12-07-20 조회 4,361
12-07-19 조회 4,707
12-07-19 조회 3,941
12-07-19 조회 3,886
12-07-19 조회 5,551
12-07-19 조회 3,493
12-07-18 조회 5,175
12-07-15 조회 4,146
12-07-14 조회 3,827
12-07-12 조회 4,503
12-07-11 조회 3,777
12-07-11 조회 3,498
12-07-11 조회 3,467
12-07-10 조회 4,649
12-07-09 조회 3,400
12-07-09 조회 4,226
12-07-09 조회 4,642
12-07-08 조회 4,560
12-07-07 조회 5,483
12-07-06 조회 4,739
12-07-06 조회 4,007
12-07-06 조회 3,894
12-07-06 조회 3,822
12-07-02 조회 5,504
12-07-02 조회 4,203
12-06-29 조회 3,725
12-06-28 조회 4,350
12-06-26 조회 3,844
12-06-26 조회 4,966
12-06-21 조회 3,939
12-06-20 조회 4,645
12-06-20 조회 4,273
12-06-15 조회 4,627
12-06-15 조회 4,366
12-06-13 조회 7,381
12-06-05 조회 7,355
12-06-04 조회 3,936
12-06-03 조회 3,782
12-05-31 조회 3,782
12-05-28 조회 6,623
12-05-27 조회 3,857
12-05-25 조회 3,993
12-05-23 조회 4,403
12-05-21 조회 5,116
12-05-17 조회 4,050
12-05-17 조회 3,971
12-05-09 조회 4,046
12-05-07 조회 4,298
12-05-02 조회 4,489
12-05-01 조회 4,665
12-04-30 조회 3,412
12-04-30 조회 4,354
12-04-25 조회 4,442
12-04-25 조회 4,868
12-04-24 조회 3,832
12-04-24 조회 4,601
12-04-23 조회 3,604
12-04-20 조회 3,244
12-04-17 조회 5,434
12-04-16 조회 4,374
12-04-14 조회 3,657
12-04-14 조회 3,685
12-04-14 조회 3,735
12-04-13 조회 3,359
12-04-13 조회 4,545
12-04-13 조회 6,183
12-04-12 조회 3,351
글쓰기