마우스오버 됫을때 그림이 바껴 신기신기
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery test</title>
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script src="../lib/jquery-1.9.1.min.js"></script>
<script src="jquery/jquery.js"></script>
</head>
<body>
<div class="header">
<ul class="menu">
<li><a href="#" class="rollover"><img src="imgs/menu01_off.png" alt="Home" /></a></li>
<li><a href="#" class="rollover"><img src="imgs/menu02_off.png" alt="Products" /></a></li>
<li><a href="#" class="rollover"><img src="imgs/menu03_off.png" alt="Company" /></a></li>
</ul>
</div>
</body>
</html>
$(function() {
$('.rollover').each(function() {
var a = $(this);
var img = a.find('img');
var src_off = img.attr('src');
var src_on = src_off.replace('_off', '_on');
a.hover(function() {
img.attr('src', src_on);
}, function() {
img.attr('src', src_off);
});
});
});
'it > jQuery' 카테고리의 다른 글
| jquery tabs 긴거 (0) | 2014.08.21 |
|---|---|
| jquery tabs (0) | 2014.08.21 |
| 새창링크 (0) | 2014.08.21 |
| 뭔가 되긴 되는거 같은데 (0) | 2014.08.21 |
| 글 숨기기. 테이블 마우스오버,. 색넣기 (0) | 2014.08.21 |
