리자

간단한 풍선도움말

책에 나온거 응용해 보았습니다.


<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script src="scripts/jquery.js"></script>
<style>
.tooltip {
  position: absolute;
  z-index: 2;
  background: #efd;
  border: 1px solid #ccc;
  padding: 3px;
}
</style>
</HEAD>

<BODY>

<span id='mover' tip='툴팁입니다.'>마우스오버</span>


<script>
$(document).ready(function() {
  var highlighted = "";
  var column = 3;

  var positionTooltip = function(event) {
    var tPosX = event.pageX;
    var tPosY = event.pageY+20;
    $('div.tooltip').css({top: tPosY, left: tPosX});
  };

  var showTooltip = function(event) {
    $('div.tooltip').remove();
    $('<div class="tooltip">' + $(this).attr('tip') + '</div>').appendTo('body');
    positionTooltip(event);
  };

  var hideTooltip = function() {
    $('div.tooltip').remove();
  };

  $('#mover')
  .hover(showTooltip, hideTooltip)
  .mousemove(positionTooltip);
});
</script>

</BODY>
</HTML>

[이 게시물은 관리자님에 의해 2011-10-31 16:55:28 jQuery에서 이동 됨]

댓글 3개

현재 /adm/에서 사용하는 help

<?=help("목록 한페이지당 라인수")?>

/adm/admin.lib.php에서...

function help($help="", $left=0, $top=0)
{
global $g4;
static $idx = 0;

$idx++;

$help = preg_replace("/\n/", "<br>", $help);

$str = "<img src='$g4[admin_path]/img/icon_help.gif' border=0 width=15 height=15 align=absmiddle onclick=\"help('help$idx', $left, $top);\" style='cursor:hand;'>";
//$str .= "<div id='help$idx' style='position:absolute; top:0px; left:0px; display:none;'>";
$str .= "<div id='help$idx' style='position:absolute; display:none;'>";
$str .= "<div id='csshelp1'><div id='csshelp2'><div id='csshelp3'>$help</div></div></div>";
$str .= "</div>";

return $str;
}

style 부분은 style.css에 넣겠지만,
$('#mover') 같은 부분을 범용화 하는거는 간단하지만 꽤 어렵네요. ㅠ..ㅠ...

시간될 때 플러그인을 한번 봐야겠어요. 코딩 스탈이 어떻게 된 것인지
좋은소스 감사드립니다.^^
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
07-07-16 조회 3,126
07-07-06 조회 3,012
07-07-06 조회 3,442
07-06-23 조회 3,270
07-06-16 조회 2,780
07-05-20 조회 4,287
07-05-09 조회 3,465
07-05-09 조회 6,103
07-05-04 조회 2,697
07-04-30 조회 9,832
07-04-27 조회 4,338
07-04-26 조회 3,449
07-04-25 조회 5,295
07-04-18 조회 7,792
07-04-13 조회 3,130
07-04-12 조회 6,640
07-04-12 조회 5,051
07-04-12 조회 3,359
07-04-11 조회 5,724
07-04-05 조회 6,369
07-03-24 조회 4,425
07-03-20 조회 3,747
07-03-18 조회 3,992
07-03-18 조회 4,740
07-03-17 조회 4,239
07-03-16 조회 4,134
07-03-15 조회 5,296
07-03-13 조회 5,404
07-03-13 조회 3,589
07-03-08 조회 4,501
07-03-08 조회 3,987
07-03-08 조회 3,298
07-03-08 조회 4,189
07-03-05 조회 4,448
07-03-04 조회 2,917
07-03-01 조회 5,949
07-02-28 조회 3,234
07-02-27 조회 4,411
07-02-26 조회 3,333
07-02-26 조회 3,041
07-02-23 조회 3,671
07-02-23 조회 3,643
07-02-22 조회 4,023
07-02-22 조회 3,834
07-02-19 조회 3,856
07-02-17 조회 4,876
07-02-14 조회 8,179
07-02-12 조회 3,948
07-02-10 조회 3,569
07-02-02 조회 3,817
07-01-31 조회 3,488
07-01-29 조회 3,347
07-01-25 조회 5,124
07-01-21 조회 3,272
07-01-19 조회 3,055
06-12-15 조회 4,068
06-12-15 조회 4,472
06-12-15 조회 2,962
06-12-15 조회 4,512
06-12-15 조회 3,400
06-12-15 조회 4,102
06-12-15 조회 3,047
06-12-15 조회 2,777
06-12-15 조회 4,638
06-12-15 조회 3,182
06-12-15 조회 3,286
06-12-07 조회 4,735
06-12-07 조회 4,020
06-12-04 조회 4,666
06-11-27 조회 3,712
06-11-21 조회 4,022
06-11-15 조회 3,453
06-11-04 조회 3,344
06-10-29 조회 3,999
06-10-13 조회 3,867
06-10-13 조회 4,227
06-10-13 조회 4,181
06-10-12 조회 5,372
06-10-12 조회 4,289
06-10-04 조회 3,790
06-10-02 조회 4,568
06-09-29 조회 3,056
06-09-26 조회 3,396
06-09-26 조회 3,658
06-09-26 조회 3,300
06-09-26 조회 3,451
06-09-26 조회 4,357
06-09-25 조회 4,662
06-09-22 조회 5,000
06-09-22 조회 3,565
06-09-21 조회 4,340
06-09-21 조회 4,344
06-09-21 조회 3,551
06-09-21 조회 5,201
06-09-21 조회 3,729
06-09-21 조회 3,459
06-09-20 조회 3,039
06-09-15 조회 3,167
06-09-13 조회 3,481
06-09-11 조회 3,285