Ada banyak cara yang dapat dilakukan untuk membuat dropdown menu salah satunya dengan menggunakan Plugin JQuery Superfish. Superfish adalah salah satu plugin gratis yang yang dapat anda download di https://superfish.joelbirch.co/. Plugin ini dapat memudahkan Anda dalam membuat menu dropdown, berikut adalah langkah-langkahnya.
Membuat File tampil.php
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/superfish.css" media="screen">
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/superfish.js"></script>
<title>Bedah PHP - Menu Dropdown pada PHP menggunakan Superfish JQuery Plugin</title>
<!-- Baris program ini akan memanggil fungsi superfish() -->
<script type="text/javascript">
jQuery(function(){
jQuery('ul.sf-menu').superfish();
});
</script>
</head>
<body>
<div class="menu-wrap">
<ul class="sf-menu">
<li><a href="#">HOME</a></li>
<li><a href="#">Menu Level 1</a>
<ul>
<li><a href="#">Menu Level 2</a></li>
<li><a href="#">Menu Level 2</a>
<ul>
<li><a href="#">Menu Level 3</a></li>
<li><a href="#">Menu Level 3</a></li>
<li><a href="#">Menu Level 3</a></li>
</ul>
</li>
<li><a href="#">Menu Level 2</a></li>
</ul>
</li>
<li><a href="#">DATABASE</a></li>
<li><a href="#">Menu Level 1</a>
<ul>
<li><a href="#">Menu Level 2</a></li>
<li><a href="#">Menu Level 2</a></li>
<li><a href="#">Menu Level 2</a></li>
</ul>
</li>
<li><a href="#">PROGRAMMING</a>
<ul>
<li><a href="#">PHP</a></li>
<li><a href="#">JAVASCRIPT</a></li>
<li><a href="#">HTML</a></li>
<li><a href="#">CSS</a></li>
</ul>
</li>
<li><a href="#">TUTORIAL</a></li>
<li><a href="#">DOWNLOAD</a></li>
</ul>
</div>
</body>
</html>
Disini saya menggunakan plugin jquery-1.6.2.min.js, plugin ini dapat Anda download di http://jquery.com/. |
| Direktori File |