Menu Jquery

Résolu/Fermé
jqr - 5 déc. 2009 à 16:39
 jqr - 6 déc. 2009 à 11:17
Bonjour, j'ai trouvé sur un site un menu qui m'intéresse, la personne qui s'occupe du site dit de prendre le code du menu dans le code source de la page.
C'est ce que j'ai fais mais sa ne fonctionne pas, je ne vois pas d'ou sa peut venir.

Voici le menu : http://www.stunicholls.com/menu/jquery-dropline-dropdown-fly-3.html#url

Et Voici le code que j'ai pris (je n'ai pas oublié de changer les liens java et css) :


<html>
<head>

<style type="text/css">


#background {width:700px; height:500px; background:url(beach.jpg); padding:12px 25px 0 25px;}

#container {width:700px; height:30px; position:relative; background:url(list-back2.gif); margin:}

#nav, #nav ul {padding:0; margin:0; list-style:none; width:700px;}

#nav li {float:left;}
#nav li a {float:left; text-decoration:none; font-family:georgia, serif; font-size:14px; color:#000;}
#nav li a b {display:block; float:left; height:30px; line-height:28px; padding:0 20px 0 10px; font-weight:normal; cursor:pointer;}
#nav li.sub a b {background:url(down.gif) no-repeat right 6px;}

#nav b.hover {color:#fff;}
#nav i.hover {color:#069;}
#nav em.hover {color:#080;}
#nav ul ul ul a:hover {color:#080;}

#nav ul {display:none;}
#nav ul {position:absolute; left:0; top:35px; background:#ddecf9;}
#nav ul li {float:left; position:relative;}
#nav ul li a {display:block; padding:0 20px 0 10px; font-size:12px; line-height:25px; cursor:pointer;}
#nav ul li a i {display:block; font-style:normal; cursor:pointer;}
#nav ul li a.sub {background:url(down.gif) no-repeat right 3px;}

#nav ul ul {width:130px; left:-1px; top:30px;}
#nav ul ul li a {display:block; line-height:20px; padding:0 0 0 10px; width:120px;}
#nav ul ul li a.fly {background:url(right.gif) no-repeat right center;}
#nav ul ul li a em {font-style:normal; display:block; width:120px; cursor:pointer;}

#nav ul ul ul {left:135px; top:0;}
</style>
<script src="jquery.js" type="text/javascript"></script>
<script src="dropshadow.js" type="text/javascript"></script>



</head>




<body>
<div id="content">
<h2> </h2>
<h3> </h3>


<div id="container" shadowid="container_dropShadow" style="z-index: 2; position: relative;">
<ul id="nav">
<li><a href="#url"><b>Home</b></a></li>
<li class="sub"><a href="#url"><b>Products</b></a>
<ul>
<li><a class="sub" href="#url"><i>Cameras</i></a>
<ul>
<li><a class="fly" href="#url"><em>Compact</em></a>
<ul>
<li><a href="#url">Panasonic</a></li>
<li><a href="#url">Nikon</a></li>
<li><a href="#url">Minolta</a></li>
<li><a href="#url">Ricoh</a></li>
<li><a href="#url">Kodak</a></li>
</ul>
</li>
<li><a class="fly" href="#url"><em>Digital</em></a>
<ul>
<li><a href="#url">Canon</a></li>
<li><a href="#url">Minolta</a></li>
<li><a href="#url">Ricoh</a></li>
<li><a href="#url">Pentax</a></li>
</ul>
</li>
<li><a class="fly" href="#url"><em>SLR</em></a>
<ul>
<li><a href="#url">Pentax</a></li>
<li><a href="#url">Kodak</a></li>
<li><a href="#url">Nikon</a></li>
<li><a href="#url">Minolta</a></li>
<li><a href="#url">Panasonic</a></li>
</ul>
</li>
</ul>
</li>
<li><a class="sub" href="#url"><i>Lenses</i></a>
<ul>
<li><a href="#url"><em>Wide Angle</em></a></li>
<li><a href="#url"><em>Standard</em></a></li>
<li><a href="#url"><em>Telephoto</em></a></li>
<li><a href="#url"><em>Zoom</em></a></li>
<li><a href="#url"><em>Mirror</em></a></li>
</ul>
</li>
<li><a href="#url"><i>Flashguns</i></a></li>
<li><a href="#url"><i>Tripods</i></a></li>
<li><a href="#url"><i>Filters</i></a></li>
</ul>
</li>
<li class="sub"><a href="#url"><b>Services</b></a>
<ul>
<li><a href="#url"><i>Printing</i></a></li>
<li><a href="#url"><i>Photo Framing</i></a></li>
<li><a href="#url"><i>Retouching</i></a></li>
<li><a href="#url"><i>Archiving</i></a></li>
</ul>
</li>
<li class="sub"><a href="#url"><b>Contacts</b></a>
<ul>
<li><a href="#url"><i>Support</i></a></li>
<li><a class="sub" href="#url"><i>Sales</i></a>
<ul>
<li><a class="fly" href="#url"><em>USA</em></a>
<ul>
<li><a href="#url">Arizona</a></li>
<li><a href="#url">California</a></li>
<li><a href="#url">Florida</a></li>
<li><a href="#url">Kansas</a></li>
<li><a href="#url">New York</a></li>
<li><a href="#url">Texas</a></li>
<li><a href="#url">Utah</a></li>
<li><a href="#url">Virginia</a></li>
</ul>
</li>
<li><a href="#url"><em>Canadian</em></a></li>
<li><a href="#url"><em>Australian</em></a></li>
<li><a class="fly" href="#url"><em>Europe</em></a>
<ul>
<li><a href="#url">England</a></li>
<li><a href="#url">France</a></li>
<li><a href="#url">Germany</a></li>
<li><a href="#url">Italy</a></li>
<li><a href="#url">Spain</a></li>
</ul>
</li>
<li><a href="#url"><em>Asian</em></a></li>
<li><a href="#url"><em>South American</em></a></li>
</ul>
</li>
<li><a href="#url"><i>Buying</i></a></li>
<li><a href="#url"><i>Photographers</i></a></li>
<li><a href="#url"><i>Stockist</i></a></li>
</ul>
</li>
<li class="sub"><a href="#url"><b>Shop</b></a>
<ul>
<li><a href="#url"><i>Online</i></a></li>
<li><a href="#url"><i>Catalogue</i></a></li>
<li><a href="#url"><i>Mail Order</i></a></li>
</ul>
</li>
<li><a href="#url"><b>Privacy Policy</b></a></li>
</ul>
<div id="container_dropShadow" class="dropShadow" style="margin: 0px; left: 24px; position: absolute; top: 75px; z-index: 1;">
</div>
</div>
</div>
</body>
</html>

Merci d'avance pour vos réponse .
A voir également:

7 réponses

avion-f16 Messages postés 19249 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 15 juin 2024 4 505
5 déc. 2009 à 16:45
As-tu télécharger les fichiers JS ?
0
Oui
0
lamidelsol Messages postés 79 Date d'inscription lundi 6 août 2007 Statut Membre Dernière intervention 12 mai 2010 4
5 déc. 2009 à 18:05
Bonjour,

Il faut que tu télécharges la bibliothèque sur le site de JQUERY.
Attention de bien vérifier les liens sur ton fichier HTML et JS.
Il s'agit de la version 1.3.2.
0
merci pour vos réponse , mais sa ne marche toujours pas.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
lamidelsol Messages postés 79 Date d'inscription lundi 6 août 2007 Statut Membre Dernière intervention 12 mai 2010 4
5 déc. 2009 à 18:24
Téléchargez directement le plugins:

http://plugins.jquery.com/project/DropShadow

Et apportez y la personnalisation necessaires afin de l'adapter à votre design.
Vous gagnerez du temps.

Cordialement,
0
Mon problème est que le sous menu ne s'affiche pas, lors du passage de la souris sur le menu rien ne ce passe.
0
C'est bon sa fonctionne , c'était une erreur de JS.
0