Bagaimana cara membuat menu yang bergerak menggunakan JQuery? Berikut cara.
Sumber:
http://dhanizone.net/jquery-menu-on-hover.html
Code:
<!DOCTYPE html>
<html>
<head>
<style>
ul { margin-left:20px; color:blue; }
li { cursor:default; }
span { color:red; }
</style>
<script src=”http://code.jquery.com/jquery-1.4.4.js”></script>
</head>
<body>
<ul>
<li class=’fade’>Home</li>
<li class=’fade’>Category</li>
<li class=’fade’>Product</li>
<li class=’fade’>Order</li>
<li class=’fade’>Inbox</li>
<li class=’fade’>Shop Config</li>
<li class=’fade’>User</li>
<li class=’fade’>Logout</li> </ul>
//li dengan ditemanin gambar 3 bintang
<script>$(“li”).hover(function () {$(this).append($(“<span> ***</span>”));
}, function () {
$(this).find(“span:last”).remove();
}
);
//li dengan class yg bergerak
$(“li.fade”).hover(function(){$(this).fadeOu(100);$(this).fadeIn(500);});</script>
</body>
</html>Sumber:
http://dhanizone.net/jquery-menu-on-hover.html