[accordian] why does this not work [Solved]
hello,
I try to make a accordian with a defenition list. To understand accordians i try to make a demo work.
But nothing happens.
my code looks like this :
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>jQuery UI Accordion</title>
<link rel="stylesheet" href="demo.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="query.easing.js">
<script type="text/javascript" src="jquery.dimensions.js"></script>
<script type="text/javascript" src="jquery.accordion.js"></script>
<script type="text/javascript">
jQuery().ready(function(){
jQuery('#navigation').accordion({
active: false,
header: '.head',
navigation: true,
event: 'mouseover',
fillSpace: true,
animated: 'easeslide'
});
</script>
</head>
<body>
<h1 id="banner"><a href="http://bassistance.de/jquery-plugins/jquery-plugin-accordion/">jQuery accordion Plugin</a> Demo</h1>
<div id="main">
<fieldset>
<legend>Navigation - Unordered List with anchors and nested lists.</legend>
<p>Location-based state-saving: The active element is choosen based on location.hash: Click one of the links, then reload the page to see it in action.</p>
<div style="height:250px;margin-bottom:1em;">
<ul id="navigation">
<li>
<a class="head" href="?p=1.1.1">Guitar</a>
<ul>
<li><a href="?p=1.1.1.1">Electric</a></li>
<li><a href="?p=1.1.1.2">Acoustic</a></li>
<li><a href="?p=1.1.1.3">Amps</a></li>
<li><a href="?p=1.1.1.4.1">Effects A</a></li>
<li><a href="?p=1.1.1.4.2">Effects B</a></li>
<li><a href="?p=1.1.1.4.3">Effects C</a></li>
<li><a href="?p=1.1.1.4.4">Effects D</a></li>
<li><a href="?p=1.1.1.5">Accessories</a></li>
</ul>
</li>
<li>
<a class="head" href="?p=1.1.2">Bass</a>
<ul>
<li><a href="?p=1.1.2.1">Electric</a></li>
<li><a href="?p=1.1.2.2">Acoustic</a></li>
<li><a href="?p=1.1.2.3">Amps</a></li>
<li><a href="?p=1.1.2.4">Effects</a></li>
<li><a href="?p=1.1.2.5">Accessories</a></li>
</ul>
</li>
<li>
<a class="head" href="?p=1.1.3">Drums</a>
<ul>
<li><a href="?p=1.1.3.2">Acoustic Drums</a></li>
<li><a href="?p=1.1.3.3">Electronic Drums</a></li>
<li><a href="?p=1.1.3.4">Cymbals</a></li>
<li><a href="?p=1.1.3.5">Hardware</a></li>
<li><a href="?p=1.1.3.6">Accessories</a></li>
</ul>
</li>
</ul>
</div>
</fieldset>
<script type="text/javascript">
jQuery(window).bind("load",function(){
$('#navigation').accordion();
};</script>
</body>
</html>
Who can help me to make this work ?
Roelof