jquery 이용한 간단한 스크롤로 오버메뉴 구현
http://www.itcan.kr/?doc=list.php&id=portfolio1
응용
<!DOCTYPE HTML>
<HTML lang="KO">
<head>
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.menu').hover(function() {
$(this).stop().animate({scrollTop:20}, 100);
},function() {
$(this).stop().animate({scrollTop:0}, 100);
});
});
</script>
</head>
<body>
<div class="menu" style="border:0px; width:100px; height:20px; overflow:hidden; float:left;"> <img src="bu_001.jpg" style="width:100px; height:20px; display:block;" /> <img src="bu_002.jpg" style="width:100px; height:20px; display:block;" /> </div>
<div class="menu" style="border:0px; width:100px; height:20px; overflow:hidden; float:left;"> <img src="bu_003.jpg" style="width:100px; height:20px; display:block;" /> <img src="bu_004.jpg" style="width:100px; height:20px; display:block;" /> </div>
</body>
</html>