Nah pada artikel ini saya akan berbagi pengetahuan saya bagaimana cara membuat menu aple dock tersebut di jadikan sebagai menu website.
Buat file dengan nama index.html dan masukan source code berikut :
<html>
<head>
<title>Apple Dock</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/interface.js"></script>
<script type="text/javascript">
$(document).ready(
function()
{
$('#dock2').Fisheye(
{
maxWidth: 60,
items: 'a',
itemsText: 'span',
container: '.dock-container2',
itemWidth: 40,
proximity: 80,
alignment : 'left',
valign: 'bottom',
halign : 'center'
}
)
}
);
</script>
</head>
<body>
<div class="dock" id="dock2">
<div class="dock-container2">
<a class="dock-item2" href="#"><span>Transaksi</span><img src="images/finance.png" alt="Transaksi" /></a>
<a class="dock-item2" href="#"><span>Lihat Laporan</span><img src="images/laporan.png" alt="Laporan" /></a>
<a class="dock-item2" href="#"><span>Grafik</span><img src="images/chart.png" alt="Grafik" /></a>
</div>
</div>
</body>
</html>
Untuk mempraktekannya silahkan download source code nya Disini
0 komentar:
Posting Komentar