책에 나온거 응용해 보았습니다.
<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>
댓글 3개
<?=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') 같은 부분을 범용화 하는거는 간단하지만 꽤 어렵네요. ㅠ..ㅠ...
시간될 때 플러그인을 한번 봐야겠어요. 코딩 스탈이 어떻게 된 것인지
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2230 | 16년 전 | 1288 | ||
| 2229 | 16년 전 | 2160 | ||
| 2228 | 16년 전 | 3222 | ||
| 2227 | 16년 전 | 2162 | ||
| 2226 | 16년 전 | 1744 | ||
| 2225 | 16년 전 | 1505 | ||
| 2224 |
 ideaman |
16년 전 | 2041 | |
| 2223 | 16년 전 | 4722 | ||
| 2222 | 16년 전 | 1404 | ||
| 2221 |
 RINIX |
16년 전 | 2140 | |
| 2220 |
RINIX |
16년 전 | 2129 | |
| 2219 |
RINIX |
16년 전 | 2400 | |
| 2218 |
RINIX |
16년 전 | 2144 | |
| 2217 |
RINIX |
16년 전 | 4433 | |
| 2216 |
RINIX |
16년 전 | 2921 | |
| 2215 | 16년 전 | 2861 | ||
| 2214 | 16년 전 | 1594 | ||
| 2213 | 16년 전 | 1235 | ||
| 2212 |
RINIX |
16년 전 | 3939 | |
| 2211 |
RINIX |
16년 전 | 1613 | |
| 2210 |
RINIX |
16년 전 | 1602 | |
| 2209 | 16년 전 | 2104 | ||
| 2208 | 16년 전 | 1878 | ||
| 2207 |
letsgolee
|
16년 전 | 1489 | |
| 2206 |
RINIX |
16년 전 | 3912 | |
| 2205 | 16년 전 | 1750 | ||
| 2204 | 16년 전 | 3131 | ||
| 2203 | 16년 전 | 3015 | ||
| 2202 | 16년 전 | 1039 | ||
| 2201 | 16년 전 | 1842 | ||
| 2200 | 16년 전 | 1589 | ||
| 2199 |
 MindMap |
16년 전 | 1848 | |
| 2198 |
태양의서쪽
|
16년 전 | 2634 | |
| 2197 |
태양의서쪽
|
16년 전 | 3015 | |
| 2196 |
태양의서쪽
|
16년 전 | 3218 | |
| 2195 | 16년 전 | 3323 | ||
| 2194 | 16년 전 | 1458 | ||
| 2193 |
letsgolee
|
16년 전 | 1417 | |
| 2192 | 16년 전 | 2253 | ||
| 2191 | 16년 전 | 1971 | ||
| 2190 |
 cmpanel |
16년 전 | 2287 | |
| 2189 | 16년 전 | 2807 | ||
| 2188 |
Sizkein
|
16년 전 | 3260 | |
| 2187 |
letsgolee
|
16년 전 | 2356 | |
| 2186 |
Sizkein
|
16년 전 | 1632 | |
| 2185 |
Sizkein
|
16년 전 | 3202 | |
| 2184 |
Sizkein
|
16년 전 | 3061 | |
| 2183 | 16년 전 | 3039 | ||
| 2182 | 16년 전 | 3905 | ||
| 2181 | 16년 전 | 2577 | ||
| 2180 |
 skinartisanCOM |
16년 전 | 2400 | |
| 2179 | 16년 전 | 2649 | ||
| 2178 | 16년 전 | 2893 | ||
| 2177 | 16년 전 | 2610 | ||
| 2176 | 17년 전 | 1450 | ||
| 2175 | 17년 전 | 1891 | ||
| 2174 | 17년 전 | 1484 | ||
| 2173 |
skinartisanCOM |
17년 전 | 1910 | |
| 2172 | 17년 전 | 2506 | ||
| 2171 | 17년 전 | 8690 | ||
| 2170 | 17년 전 | 3147 | ||
| 2169 | 17년 전 | 4235 | ||
| 2168 |
cmpanel |
17년 전 | 1975 | |
| 2167 | 17년 전 | 3653 | ||
| 2166 |
cmpanel |
17년 전 | 1545 | |
| 2165 | 17년 전 | 1381 | ||
| 2164 | 17년 전 | 2316 | ||
| 2163 | 17년 전 | 1313 | ||
| 2162 | 17년 전 | 1635 | ||
| 2161 | 17년 전 | 1454 | ||
| 2160 | 17년 전 | 2525 | ||
| 2159 |
inxps
|
17년 전 | 1491 | |
| 2158 |
inxps
|
17년 전 | 1090 | |
| 2157 | 17년 전 | 1218 | ||
| 2156 | 17년 전 | 3092 | ||
| 2155 | 17년 전 | 2162 | ||
| 2154 | 17년 전 | 1969 | ||
| 2153 |
 똥싼너구리 |
17년 전 | 1218 | |
| 2152 |
letsgolee
|
17년 전 | 2453 | |
| 2151 | 17년 전 | 1169 | ||
| 2150 |
아름다운세상
|
17년 전 | 1124 | |
| 2149 |
아름다운세상
|
17년 전 | 1365 | |
| 2148 |
아름다운세상
|
17년 전 | 2731 | |
| 2147 |
 넥스트스텝 |
17년 전 | 2394 | |
| 2146 | 17년 전 | 2481 | ||
| 2145 | 17년 전 | 1183 | ||
| 2144 | 17년 전 | 1300 | ||
| 2143 | 17년 전 | 3241 | ||
| 2142 | 17년 전 | 2828 | ||
| 2141 | 17년 전 | 4105 | ||
| 2140 | 17년 전 | 2254 | ||
| 2139 | 17년 전 | 2345 | ||
| 2138 | 17년 전 | 1394 | ||
| 2137 | 17년 전 | 2513 | ||
| 2136 | 17년 전 | 2200 | ||
| 2135 | 17년 전 | 2959 | ||
| 2134 |
아름다운세상
|
17년 전 | 2467 | |
| 2133 |
Juinjang
|
17년 전 | 1629 | |
| 2132 | 17년 전 | 2426 | ||
| 2131 | 17년 전 | 1587 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기