Forum PHP.pl > problem z menu rozwijanym

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: problem z menu rozwijanym - nie rozwija sie :-(

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

InosU31

19.01.2013, 21:58:25

Witam

Siedze juz drugi dzien nad tym menu i nie wiem co robic... Zrobilem sobie pionowe menu rozwijane ale sie nie rozwija... Znalazlem "gotowca" ale tez nie dziala i nie wiem juz gdzie mam blad. Mam nadzieje ze ktos znajdzie blad.

Z gory dziekuje za pomoc

Ponizej podaje kody:

[HTML] pobierz, plaintext 
<html>
<head>
<title></title>
        <link rel='stylesheet' type='text/css' href='arkusz.css' />
    </head>
    <body>
 
<div id="multi_drop_menus">
 
	<ul>
		<li><a href="#">Element 1</a>
			<ul>
				<li><a href="#">Element 1a</a></li>
				<li><a href="#">Element 1b</a></li>			
			</ul>		
		</li>
 
		<li><a href="#">Element 2</a></li>
	</ul>
 
</div>
 
 
    </body>
</html>
 
[HTML] pobierz, plaintext

plik css:

[XML] pobierz, plaintext 
/*------------div-------*/
#multi_drop_menus * {	/*wszystkie elementy*/
	margin:0;				/*usowa domyslne marginesy*/
	padding:0;
	}
/*------------div-------*/	
#multi_drop_menus {			/*element div*/
	/*behavior:url(../lib/js_tools/csshover.htc);*/
	border:3px solid green;
	float:left;				/*zmusza element div do otoczenia elementu ul*/
	}
/*------------nadrzedny ul-------*/	
#multi_drop_menus ul {
	border:2px solid red;			/*pokazuje kontener*/
	float:left;				/*zmusza element ul do otoczenia elementu li*/
	}
/*------------nadrzedny li-------*/	
#multi_drop_menus li {
	border:2px solid blue;			/*pkazuje kontener*/
	list-style-type:none;			/*usowa punktory elementow listy*/
	position:relative;				/*pozycjonowanie tesci zagniedzonej listy ul*/
	}
/*------------podrzedny ul-------*/	
#multi_drop_menus li ul {
	position:absolute;
	width:7em;
	display:none;				/*ukrywa menu rozwijane - pokazujace sie po najechaniu kursorem*/
	}
/*------------podrzedny li-------*/	
#multi_drop_menus li ul li {
	width:100%;
	}
/*------------podrzedny ul i li schowany-------*/	
#muulti_drop_menus li:hover ul {
	display:block;				/*pokazuje menu rozwijane, gdy kursor znajdzie sie nadrzednym elementem li*/
	} 
/*------------blok z linkiem-------*/	
#multi_drop_menus a {
	display:block;					/*sprawia ze kontener zawierajacy odnosnok przyjmuje odpowiedni rozmiar*/
	background-color:#DDD;
	padding:.3em 6px;
	}
/*------------schowany blok a-------*/	
#multi_drop_menus a:hover {
	color:#CCC;						/*kolor tekstu po najechaniu kursorem*/
	background-color:#666;		/*kolor tla po najechaniu kursorem*/
	}
 
 
 
[XML] pobierz, plaintext

Pozdrawiam
Jacek

fizzlebubble

20.01.2013, 11:49:11

Proszę: http://jsbin.com/ulesuy/1/edit

Ogólnie te komentarze w CSSie bardziej przeszkadzały niż pomagały

InosU31

20.01.2013, 16:03:42

Dziękuje Ci bardzo :-D No dziala w koncu

Musze to teraz przeanalizowac ;-) Przez ten odstep chyba ciezko najechac na podlink. Ten Js jest potrzebny? Pozdrawiam i jeszcze raz dzieki :-)

fizzlebubble

20.01.2013, 16:16:06

Musisz to już sobie poustawiać jak Ci wygodnie. Jaki JS?

InosU31

20.01.2013, 17:32:12

[XML] pobierz, plaintext 
 
$(".first").click(function() {
  $(".second").fadeOut(500);
  )};
[XML] pobierz, plaintext

bez tego tez dziala wiec chyba nie:-)

W koncu bede mogl ruszyc dalej a tym menu:-)

fizzlebubble

20.01.2013, 17:34:45

Ups, moje syfy w jsbinie

. Sama budowa takiego menu jest banalna, tylko przydatny jest selektor bezpośredniego dziecka ">"

. Jakbyś dalej miał jakiś problem to służę pomocą.

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.