Why doesn't my carousel in bootstrap 3.3.7 work?
I've been using dreamweaver for only a few months. My carousel on my index page was working fine until I moved some of my files around so that they would all be in the same folder. Now my carousel won't work at all, I've tried deleting the old carousel and adding a new one, I tried to delete my old file of bootstrap and add a new one... nothing worked. The only thing different between my code for the old carousel that worked and my new code that doesn't work is that this bootstrap has 3.3.7 in the name... could this be my problem?
This is my code:
<!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.0">
<title>INARELS Research</title>
<!-- <link href="css/bootstrap.css" rel="stylesheet" type="text/css"> -->
<link href="css/bootstrap-3.3.7.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">
<!--The following script tag downloads a font from the Adobe Edge Web Fonts server for use within the web page. We recommend that you do not modify it.-->
<script>var __adobewebfontsappname__="dreamweaver"</script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="home1">
<br>
<br>
<br>
<nav>
<ul class= "navlist">
<li class="navlistitem active"><a href="index.html">Home</a> </li>
<li class="navlistitem"><a href="About.html">About</a> </li>
<li class="navlistitem"><a href="OurResearchers.html">Our Researchers</a></li>
<li class="navlistitem"><a href="Projects.html">Projects</a></li>
<li class="navlistitem"><a href="ContactUs.html">Contact Us</a></li>
</ul>
</nav>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<div id="carousel1" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carousel1" data-slide-to="0" class="active"></li>
<li data-target="#carousel1" data-slide-to="1"></li>
<li data-target="#carousel1" data-slide-to="2"></li>
</ol>
<div class="carousel-inner" role="listbox">
<div class="item active"><img src="images/Carousel_Placeholder.png" alt="First slide image" class="center-block">
<div class="carousel-caption">
<h3>First slide Heading</h3>
<p>First slide Caption</p>
</div>
</div>
<div class="item"><img src="images/Carousel_Placeholder.png" alt="Second slide image" class="center-block">
<div class="carousel-caption">
<h3>Second slide Heading</h3>
<p>Second slide Caption</p>
</div>
</div>
<div class="item"><img src="images/Carousel_Placeholder.png" alt="Third slide image" class="center-block">
<div class="carousel-caption">
<h3>Third slide Heading</h3>
<p>Third slide Caption</p>
</div>
</div>
</div>
<a class="left carousel-control" href="#carousel1" role="button" data-slide="prev"><span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span><span class="sr-only">Previous</span></a><a class="right carousel-control" href="#carousel1" role="button" data-slide="next"><span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span><span class="sr-only">Next</span></a></div>
<br>
<br>
</div>
<br>
AdChoices