|
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mouse Hover() 로 마우스 오버와 아웃을 동시 처리 </title>
<style type="text/css">
.redColor { color:Red;}
.hover { cursor:hand; background-color:Yellow;}
</style>
<script src="../jquery-1[1].3.2-vsdoc2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
//$('table tr:gt(0) 필터 메서드 사용하여 제목에는 해제하여 주고자 할경우 사용
$('table tr').hover(function () { $(this).addClass('hover'); },
function () { $(this).removeClass('hover'); });
});
</script>
</head>
<body>
<div>
<table border="2" align="center" Height="150px" >
<tr>
<td>글 번호</td>
<td>제목</td>
<td>작성자</td>
<td>작성날짜</td>
<td>IP주소</td>
</tr>
<tr>
<td>1</td>
<td>안녕하세요</td>
<td>김용원</td>
<td>2009-11-06</td>
<td>192.168.10.17</td>
</tr>
<tr>
<td>2</td>
<td>안녕하세요 만나서 반가워요</td>
<td>주국원</td>
<td>2009-11-05</td>
<td>192.168.10.17</td>
</tr>
<tr>
<td>3</td>
<td>안녕하세요 다음에 또 만나요</td>
<td>이둔철</td>
<td>2009-11-08</td>
<td>192.168.10.17</td>
</tr>
<tr>
<td>4</td>
<td>안녕하세요 다음에 또 만나요</td>
<td>Agent</td>
<td>2009-11-08</td>
<td>192.168.10.18</td>
</tr>
</table>
<div align="center" >
<input id="btnList" type="button" value="목록" />
<input id="btnWrite" type="button" value="글쓰기" />
</div>
</div>
</body>
</html> | 
