<script type="text/javascript"> /* This script and many more are available free online at The JavaScript Source!! http://javascript.internet.com Created by: Konstantin Jagello | http://javascript-array.com/ */ var TimeOut = 300; var currentLayer = null; var currentitem = null; var currentLayerNum = 0; var noClose = 0; var closeTimer = null; function mopen(n) { var l = document.getElementById("menu"+n); var mm = document.getElementById("mmenu"+n); if(l) { mcancelclosetime(); l.style.visibility='visible'; if(currentLayer && (currentLayerNum != n)) currentLayer.style.visibility='hidden'; currentLayer = l; currentitem = mm; currentLayerNum = n; } else if(currentLayer) { currentLayer.style.visibility='hidden'; currentLayerNum = 0; currentitem = null; currentLayer = null; } } function mclosetime() { closeTimer = window.setTimeout(mclose, TimeOut); } function mcancelclosetime() { if(closeTimer) { window.clearTimeout(closeTimer); closeTimer = null; } } function mclose() { if(currentLayer && noClose!=1) { currentLayer.style.visibility='hidden'; currentLayerNum = 0; currentLayer = null; currentitem = null; } else { noClose = 0; } currentLayer = null; currentitem = null; } document.onclick = mclose; </script> <style> #dd { margin-left: 25%; padding: 0 0 20px 0; } #dd li { margin: 0; padding: 0; list-style: none; float: left; font: bold 11px arial; } #dd li a.menu { display: block; text-align: center; background: #5970B2; padding: 4px 10px; margin: 0 1px 0 0; color: #FFF; width: 60px; text-decoration: none; } #dd li a.menu:hover { background: #49A3FF; } .submenu { background: #EAEBD8; border: 1px solid #5970B2; visibility: hidden; position: absolute; z-index: 3; } .submenu a { display: block; font: 11px arial; text-align: left; text-decoration: none; padding: 5px; color: #2875DE; } .submenu a:hover { background: #49A3FF; color: #FFF; } </style> <ul id="dd"> <li><a href="#" class="menu" id="mmenu1" onmouseover="mopen(1);" onmouseout="mclosetime();">Home</a> <div class="submenu" id="menu1" onmouseover="mcancelclosetime()" onmouseout="mclosetime();"> <a href="#">HTML Tutorials</a> <a href="#">DHTML Tutorials</a> <a href="#">JavaScript Tutorials</a> <a href="#">CSS Tutorials</a> </div> </li> <li><a href="#" class="menu" id="mmenu2" onmouseover="mopen(2);" onmouseout="mclosetime();">Download</a> <div class="submenu" id="menu2" onmouseover="mcancelclosetime()" onmouseout="mclosetime();"> <a href="#">ASP Scripts</a> <a href="#">PHP Scripts</a> <a href="#">Ajax Scripts</a> <a href="#">Perl Scripts</a> </div> </li> <li><a href="#" class="menu">Order</a></li> <li><a href="#" class="menu">Help</a></li> <li><a href="#" class="menu" id="mmenu3" onmouseover="mopen(3);" onmouseout="mclosetime();">Contact</a> <div class="submenu" id="menu3" onmouseover="mcancelclosetime()" onmouseout="mclosetime();"> <a href="#">Office</a> <a href="#">Sales</a> <a href="#">Customer Service</a> <a href="#">Shipping</a> </div> </li> </ul>

 Kodu Kopyala

Hata Bildir | Tavsiye Et
 

Bu içeriğe oy verin: 1 2 3 4 5 6 7 8 9 10

Yorumlar / Yeni Yorum Yaz

Bu içeriğe yorum yazılmamış.