Bootstrap dropdown isn’t working for me. I did everything correctly as you can see it there:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Test site | Jony</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Testing website coded by Jony - rapture-gfx" />
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen"/>
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen"/>
<link href='http://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'><link rel="stylesheet" href="css/flexslider.css" type="text/css"><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script><script src="js/jquery.flexslider.js"></script><!-- Place in the <head>, after the three links --> <script type="text/javascript" charset="utf-8">$(window).load(function() { $('.flexslider').flexslider({ animation: "slide" });});</script>
<link rel="stylesheet" href="flexslider.css" type="text/css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="js/jquery.flexslider.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.lavalamp-1.4.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script type="text/javascript">
$('.dropdown-toggle').dropdown()
</script>
</head>
<header>
<div class="header">
<div class="container">
<ul class="menu">
<li class="current"><span style="color: #bde2e1;">Home</li>
<li class="dropdown"><a class="dropdown-toggle" href="#">Servers</a>
<ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
<li class="hovering"><a href="#">Portfolio</a></li>
<li class="hovering"><a href="#">Releases</a></li>
<li class="hovering"><a href="#">Contact</a></li>
</ul>
</li>
<li class="hovering"><a href="#">Portfolio</a></li>
<li class="hovering"><a href="#">Releases</a></li>
<li class="hovering"><a href="#">Contact</a></li>
</ul>
Bootstrap is a ready framework with features like grid system, rows, ready js menus and more.
There’s an explanation of how it works:
http://twitter.github.com/bootstrap/javascript.html#dropdowns
It doesn’t work for me.
Yes, my src links correctly to the JS files.
your missing the
bodyin your html.put your script at the bottom of the page or after ready:
demo: http://jsfiddle.net/rLL75/
EDIT:
use a newer version of jquery.