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

Problem z karuzelą w Bootstrap

Object Storage Arubacloud
0 głosów
611 wizyt
pytanie zadane 1 grudnia 2015 w HTML i CSS przez keyram Obywatel (1,520 p.)

Hej!

W swoim projekcie chcę, aby karuzela poruszała się automatycznie. Niestety po wielu próbach nadal mi nie wychodzi. Nie mogę nawet zmieniać slidów ręcznie (klikając na kropki nawigacyjne).

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Projekt 1</title>
		<!-- CSS -->
		<link href='https://fonts.googleapis.com/css?family=Lato:400,700,100' rel='stylesheet' type='text/css'>
		<link rel="stylesheet" type="text/css" href="css/style.css">
		<link rel="stylesheet" type="text/css" href="css/animate.min.css">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
		<!-- JavaScript -->
		<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
	</head>
	<body>
		
		<!-- Nagłówek -->
		<header id="top_menu" class="navbar-fixed-top">
			<div class="container">
				<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
					<nav class="navbar navbar-inverse" role="navigation" id="navi">
						<div class="container-fluid">
							<div class="navbar-header">
								<button type="button" data-toggle="collapse" class="navbar-toggle" data-target="#my_menu">
									<span class="sr-only">Navigation</span>
									<span class="icon-bar"></span>
									<span class="icon-bar"></span>
									<span class="icon-bar"></span>
								</button>
								<div id="logo">
									<a href="index.html"><img src="images/logo.png"></a>
								</div>
							</div>
							<div class="collapse navbar-collapse" id="my_menu">
								<ul class="nav navbar-nav navbar-right" id="ul_navigation">
									<li class="active"><a href="#">Start</a></li>
									<li><a href="#offer">Oferta</a></li>
									<li><a href="#workers">Pracownicy</a></li>
									<li><a href="#services">Usługi</a></li>
									<li><a href="#references">Referencje</a></li>
									<li><a href="#contact">Kontakt</a></li>
								</ul>
							</div>
						</div>
					</nav>
				</div>
			</div>
		</header>
		
		<!-- Karuzela -->
		<div id="slide_show" class="carousel slide" data-ride="carousel">
  			<ol class="carousel-indicators">
    			<li data-target="#slide_show" data-slide-to="0" class="active"></li>
    			<li data-target="#slide_show" data-slide-to="1"></li>
    			<li data-target="#slide_show" data-slide-to="2"></li>
 		 	</ol>
			<div class="carousel-inner">
				<div class="item active">
					<img src="images/slide_1.jpg" alt="slide1" class="img-responsive">
			      	<div class="carousel-caption">
			        	<h1>Strona projektu numer 1</h1>
			        	<p>Witryna wykorzystuje technologie HTML, CSS(Bootstrap) i JavaScript(jQuery)</p>
			      	</div>
			    </div>
			    <div class="item">
			      <img src="images/slide_2.jpg" alt="slide2" class="img-responsive">
			      	<div class="carousel-caption">
			        	<h1>Strona projektu numer 1</h1>
			        	<p>Witryna wykorzystuje technologie HTML, CSS(Bootstrap) i JavaScript(jQuery)</p>
			      	</div>
			    </div>
			    <div class="item">
			      <img src="images/slide_3.jpg" alt="slide3" class="img-responsive">
			      	<div class="carousel-caption">
			        	<h1>Strona projektu numer 1</h1>
			        	<p>Witryna wykorzystuje technologie HTML, CSS(Bootstrap) i JavaScript(jQuery)</p>
			      	</div>
			    </div>
			</div>
		</div>
	</body>
</html>

 

1 odpowiedź

0 głosów
odpowiedź 1 grudnia 2015 przez tymon_rogowski Bywalec (2,960 p.)
wybrane 1 grudnia 2015 przez keyram
 
Najlepsza
Po pierwsze: Uruchomiłem sobie Twój kod i od razu dostałem w konsoli: "Uncaught Error: Bootstrap's JavaScript requires jQuery". Jak sobie zaciągnąłem jquery lokalnie to wszystko jest ok. Sprawdź u siebie.

Po drugie: Jak trzymasz kursor na karuzeli to się nie będzie automatycznie zmieniać.

Po trzecie: Na przyszłość warto żebyś wrzucał jakiś minimalny ale całościowy kod którego dotyczy problem na githuba/codepen/jsfiddle. Żadko komu będzie się chciało kopiować kod ze strony i potem jeszcze uzupełniać o biblioteki, obrazki etc. żeby coś przetestować. Im mniej "męczarni" dla odpowiadającego tym większa szansa że dostaniesz sensowną odpowiedź :)
komentarz 1 grudnia 2015 przez keyram Obywatel (1,520 p.)
Dzięki! Rozwiązane!

Podobne pytania

0 głosów
0 odpowiedzi 60 wizyt
+1 głos
2 odpowiedzi 235 wizyt
pytanie zadane 2 maja 2021 w HTML i CSS przez MateuszSikorski Obywatel (1,070 p.)
0 głosów
2 odpowiedzi 90 wizyt
pytanie zadane 5 lipca 2020 w HTML i CSS przez niezalogowany

92,592 zapytań

141,441 odpowiedzi

319,701 komentarzy

61,975 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.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...