 [JavaScript][jquery]rozwijane menu |
  |
| [JavaScript][jquery]rozwijane menu |
 5.11.2008, 16:29:46
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 51 Pomógł: 1 Dołączył: 22.08.2008 Ostrzeżenie: (0%) 
 |
mam problem zrobilem sobie proste rozwijane menu w javascript za pomoca jquery i funkcji slideUp i slideDown :
CODE <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="jquery.js"></script> <style> @import url('reset.css'); @import url('style.css'); </style> <title>jquery</title> <script type="text/javascript"> $(document).ready(function(){ $("#header1").mouseover(function () { $("#category1").slideDown("slow"); }) $("#header1").mouseout(function () { $("#category1").slideUp("slow"); }); $("#header2").mouseover(function () { $("#category2").slideDown(); }); $("#header2").mouseout(function () { $("#category2").slideUp(); }); $("#header3").mouseover(function () { $("#category3").slideDown(); }); $("#header3").mouseout(function () { $("#category3").slideUp(); }); $("#header4").mouseover(function () { $("#category4").slideDown(); }); $("#header4").mouseout(function () { $("#category4").slideUp(); }); }); </script> </head> <body><div id="menu"> <div class="header" id="header1"> <div class="category" id="category1"></div> </div> <div class="header" id="header2"> <div class="category" id="category2"></div> </div> <div class="header" id="header3"> <div class="category" id="category3"></div> </div> <div class="header" id="header4"> <div class="category" id="category4"></div> </div> <div class="clear"></div> </div> </body> </html> style.css wyglada tak: CODE body { } #menu { margin: 40px auto 0 auto; height: 100px; width: 500px; background-color: green; } .header { width: 100px; height: 100px; float: left; } #menu #category1 { display: none; position: absolute; top: 140px; left: 450px; width: 100px; height: 100px; background-color: red; } #menu #category2 { display: none; position: absolute; top: 140px; left: 551px; width: 100px; height: 100px; background-color: red; } #menu #category3 { display: none; position: absolute; top: 140px; left: 652px; width: 100px; height: 100px; background-color: red; } #menu #category4 { display: none; position: absolute; top: 130px; left: 753px; width: 100px; height: 100px; background-color: red; } #menu #category5 { display: none; position: absolute; top: 140px; left: 854px; width: 100px; height: 100px; background-color: red; } div.clear { clear: both; } nawet dziala menu poza jednym wyjatkiem jak najezdzam na diva category menu rozwijane rozwija sie i zwija i tak caly czas:/ probowalem to samo menu tylko ze zamiast slideUp i Down uzylem "show" i "hide" i wszystko dzialalo:/ moze mi ktos powiedziec co jst grane? moze zle kod ulozylem? wszelkie poprawki do kodu mile widziane:) |
 |
 
|
|
|
Wersja Lo-Fi | Aktualny czas: 16.07.2025 - 13:55 |
