• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Bootstrap- problem z menu

Mały hosting, OGROMNE możliwości
0 głosów
1,569 wizyt
pytanie zadane 15 kwietnia 2016 w HTML i CSS przez 23yes Użytkownik (500 p.)

Nie działa rozwijane małe menu po zmniejszeniu ekranu.
Szukałem i nic nie znalazłem. Z góry dziękuje za pomoc.

 

	<div class="navbar navbar-default">
		<div class="container-fluid">
			<div class="navbar-header">
			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mynavbar-content"	>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			</button>	
			<a class="navbar-brand" href="#">SitePoint</a>
			</div>
			
				<div class="collapse navbar-collapse" id="mynavbar-content">
				<ul class="nav navbar-nav">
				<li class="active"><a href="#">Strona głowna</a></li>
				<li><a href="#"> Onas</a></li>
				<li><a href="#"> Cennik</a></li>
				<li><a href="#"> Oferta</a></li>
				<li><a href="#"> Kontakt</a></li>	
				</ul>
		
		
		

		</div></div></div>

 

3 odpowiedzi

+3 głosów
odpowiedź 15 kwietnia 2016 przez radek024 Szeryf (77,160 p.)
Podlinkowałeś w odpowiedniej kolejności plik js z bootstrapa oraz jquery? Pierwszy powinien być link do jquery, drugi - do bootstrapa.
komentarz 15 kwietnia 2016 przez Mateusz11 Pasjonat (22,910 p.)
Przecież tu nie chodzi o JS, tylko o CSS... Po co Ci tu jquery?
2
komentarz 15 kwietnia 2016 przez kubaapk Nałogowiec (44,270 p.)
Żeby collapsed menu w działał musisz podlinkować skrypty.
komentarz 15 kwietnia 2016 przez HaKIM Szeryf (87,590 p.)
Tak to powinno wyglądać:

Bootstrap Css, Twój Css, Jquery no i Bootstrap Js.

: )
komentarz 15 kwietnia 2016 przez 23yes Użytkownik (500 p.)

dzięki za tyle odpowiedzi :) bład był strasznie głupi i dzięki wam go znalazłem.
 

	<script src="/js/jquery.js"></script>
	<script src="js/bootstrap.js"></script>

Jedna cholerna kreseczka :) teraz śmiga. Bardzo fajna z was społeczność, jeszcze raz dziękuje za pomoc.

1
komentarz 15 kwietnia 2016 przez HaKIM Szeryf (87,590 p.)
0 głosów
odpowiedź 15 kwietnia 2016 przez Mateusz11 Pasjonat (22,910 p.)
Jak nie działa? Co Ci się dzieje? Może SS?
komentarz 15 kwietnia 2016 przez 23yes Użytkownik (500 p.)

Głupi błąd :)

<script src="/js/jquery.js"></script>
<script src="js/bootstrap.js"></script>

o jedną kreskę za daleko.

–1 głos
odpowiedź 15 kwietnia 2016 przez kubaapk Nałogowiec (44,270 p.)
Używaj tagów HTML5.
1
komentarz 15 kwietnia 2016 przez kubaapk Nałogowiec (44,270 p.)
1. To, że ludzie czytają przestarzałe tutoriale uczące złych praktyk. Powinno się wytykać te błędy aż je zrozumieją.

2. To, że jest to bootstrap nie zwalnia z konieczności pisania semantycznego kodu HTML.

3. Odpowiedź padła już wyżej, zapewne zła kolejność linkowania skryptów.
komentarz 15 kwietnia 2016 przez niezalogowany

1. Co mu dadzą tagi HTML5?

Mateusz11 - weź wyjdź, naucz się podstaw htmla i dopiero wróć komentować.

Semantyka to NAJWAŻNIEJSZA część dokumentu HTML.

komentarz 15 kwietnia 2016 przez niezalogowany

2. To jest bootstrap, a nie zwykły HTML

A Bootstrap to co to jest w warstwie treści? Magiczny HTML? 

komentarz 15 kwietnia 2016 przez Mateusz11 Pasjonat (22,910 p.)
On tu się pyta  o menu a nie o tagi footer, header, article...
komentarz 15 kwietnia 2016 przez niezalogowany

On tu się pyta  o menu a nie o tagi footer, header, article...

I to zwalnia go od pisania poprawnego kodu?

komentarz 15 kwietnia 2016 przez kubaapk Nałogowiec (44,270 p.)

I to zwalnia go od pisania poprawnego kodu?

Odpuść ;)

komentarz 15 kwietnia 2016 przez Mateusz11 Pasjonat (22,910 p.)
Nie zwalnia go, ale w sumie nie podał całego kodu strony, może ma <footer><header> xD
2
komentarz 15 kwietnia 2016 przez niezalogowany
edycja 15 kwietnia 2016

Nie ma odpuść - Mateusz11 pójdzie dalej i nadal będzie niejawnie szerzył standardy z 2010 roku.

komentarz 15 kwietnia 2016 przez 23yes Użytkownik (500 p.)

Masz rację przerabiam książkę "Bootstrap. Tworzenie interfejsów stron WWW. Technologia na start!" z heliona wydana w 2015 roku więc chyba aktualna. Jestem strasznie podatny na nawyki. Więc jeśli możesz przejrzeć mój kod i wskazać błędy będę wdzięczny.

 

<!DOCTYPE html>
<html>

<head>

<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE-edge">
<meta name="viewport" content="width=device-width, initial-scale-1">
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">

<title>Untitled 1</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="css/style.css">


<!--[if lt IE 9]>
  <script src="html5shiv.min.js"></script>
  <script src="respond.min.js"></script>
<![endif]-->

</head>
<body>
	
	
	
	<div class="navbar navbar-default">
		<div class="container-fluid">
			<div class="navbar-header">
			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#mynavbar-content"	>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			<span class="icon-bar"></span>
			</button>	
			<a class="navbar-brand" href="#">SitePoint</a>
			</div>
			
				<div class="collapse navbar-collapse" id="mynavbar-content">
				<ul class="nav navbar-nav">
				<li class="active"><a href="#">Strona głowna</a></li>
				<li><a href="#"> Onas</a></li>
				<li><a href="#"> Cennik</a></li>
				<li><a href="#"> Oferta</a></li>
				<li><a href="#"> Kontakt</a></li>	
				</ul>
		
		
		
		
		</div></div></div>
	
	
	
		<script src="js/jquery.js"></script>
	<script src="js/bootstrap.js"></script>
</body>

</html>

 

2
komentarz 15 kwietnia 2016 przez niezalogowany
edycja 15 kwietnia 2016
  • Do tagu <html> dodaj atrybut lang. lang="pl"
  • <meta content="text/html; charset=utf-8" http-equiv="Content-Type">

    To jest starożytne ustawianie kodowania - do wywalenia. Kodowanie masz ustawione tutaj <meta charset="utf-8">. (Jak chcesz być super-poprawny to UTF-8 : ) dawno temu utf-8 pisane małymi literami było błędem)

  • <meta http-equiv="X-UA-Compatible" content="IE-edge">

    To z powodzeniem można słać jako nagłówek HTTP.

  • <link rel="stylesheet" type="text/css" href="css/style.css">

    type="text/css" <- niepotrzebne.

  • Jeśli chodzi o kod samej nawigacji, najlepiej porównać go z dokumentacją bootstrapa (navbar)

(Edit: Jak coś to z tym szerzeniem starych standardów, chodziło mi o mateusza11 : ) )

Podobne pytania

+1 głos
2 odpowiedzi 393 wizyt
pytanie zadane 2 maja 2021 w HTML i CSS przez MateuszSikorski Obywatel (1,070 p.)
0 głosów
4 odpowiedzi 2,331 wizyt
pytanie zadane 13 marca 2016 w HTML i CSS przez ShadoWs Bywalec (2,800 p.)
+1 głos
0 odpowiedzi 274 wizyt
pytanie zadane 21 czerwca 2016 w HTML i CSS przez mordimer Mądrala (5,720 p.)

93,715 zapytań

142,629 odpowiedzi

323,261 komentarzy

63,259 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Twierdza Linux. Bezpieczeństwo dla dociekliwych

Aby uzyskać rabat -10%, użyjcie kodu pasja-linux, wpisując go w specjalne pole w koszyku.

...