Не сте регистриран!
Регистрирайте се БЕЗПЛАТНО, за да използвате услугите на сайта!
Красиво dropdown меню
Автор iwanov (31.03.2008 17:55)
съобщение до автора
Погледнат 1672 пъти
добави към любими
Оценка добави коментар
Гласове 3
изпрати на приятел
Коментари (3)
абонирай се за JavaScript
Ето html и JS кода:
CODE 1 m ) ddmenuitem . style . visibility = ' hidden ' ; ddmenuitem = document . getElementById ( id ) ; ddmenuitem . style . visibility = ' visible ' ; function mclose () if ( ddmenuitem ) ddmenuitem . style . visibility = ' hidden ' ; } function mclosetime () closetimer = window . setTimeout ( mclose , timeout ) ; } function mcancelclosetime () if ( closetimer ) window . clearTimeout ( closetimer ) ; closetimer = null ; } document . onclick = mclose ; script > head > body > ul id = " sddm " > li >< a href = " # " onmouseover = " mopen('m1') " onmouseout = " mclosetime() " > Home </ a > div id = " m1 " onmouseover = " mcancelclosetime() " onmouseout = " mclosetime() " > a href = " # " > HTML DropDown </ a > a href = " # " > DHTML DropDown menu </ a > a href = " # " > JavaScript DropDown </ a > a href = " # " > DropDown Menu </ a > a href = " # " > CSS DropDown </ a > div > li > li >< a href = " # " onmouseover = " mopen('m2') " onmouseout = " mclosetime() " > Download </ a > div id = " m2 " onmouseover = " mcancelclosetime() " onmouseout = " mclosetime() " > a href = " # " > ASP Dropdown </ a > a href = " # " > Pulldown menu </ a > a href = " # " > AJAX dropdown </ a > a href = " # " > DIV dropdown </ a > div > li > li >< a href = " # " onmouseover = " mopen('m3') " onmouseout = " mclosetime() " > Order </ a > div id = " m3 " onmouseover = " mcancelclosetime() " onmouseout = " mclosetime() " > a href = " # " > Visa Credit Card </ a > a href = " # " > Paypal </ a > div > li > li >< a href = " # " onmouseover = " mopen('m4') " onmouseout = " mclosetime() " > Help </ a > div id = " m4 " onmouseover = " mcancelclosetime() " onmouseout = " mclosetime() " > a href = " # " > Download Help File </ a > a href = " # " > Read online </ a > div > li > li >< a href = " # " onmouseover = " mopen('m5') " onmouseout = " mclosetime() " > Contact </ a > div id = " m5 " onmouseover = " mcancelclosetime() " onmouseout = " mclosetime() " > a href = " # " > E - mail </ a > a href = " # " > Submit Request Form </ a > a href = " # " > Call Center </ a > div > li > ul > div style = " clear:both " ></ div > div style = " clear:both " ></ div > body > html >
Ето и нужния CSS код към менюто:
default.css
CODE 1 #sddm { margin: 0 ; padding: 0 ; z-index: 30 } #sddm li { margin: 0 ; padding: 0 ; list-style: none ; float: left ; font: bold 11 px arial } #sddm li a { display: block ; margin: 0 1 px 0 0 ; padding: 4 px 10 px ; width: 60 px ; background: #5970B2 ; color: #FFF ; text-align: center ; text-decoration: none } #sddm li a :hover { background: #49A3FF } #sddm div { position: absolute ; visibility: hidden ; margin: 0 ; padding: 0 ; background: #EAEBD8 ; border: 1 px solid #5970B2 } #sddm div a { position: relative ; display: block ; margin: 0 ; padding: 5 px 10 px ; width: auto ; white-space: nowrap ; text-align: left ; text-decoration: none ; background: #EAEBD8 ; color: #2875DE ; font: 11 px arial } #sddm div a :hover { background: #49A3FF ; color: #FFF }
За автора: iwanov
Казвам се Галин Иванов и обичам да се занимавам с програмиране и като цяло с компютри. Разбирам от HTML, CSS, PHP и MySQL. Старая се да научавам постоянно нови неща от IT сферата.
1 посетител чете този скрипт (0 потребители и 1 гост)
Активни потребители:
---
