Sujet Précédent Sujet Suivant

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

Réponse 1 / 7
avion-f16 Messages postés 19246 Date d'inscription dimanche 17 février 2008 Statut Contributeur Dernière intervention 21 avril 2024 4 497
5 déc. 2009 à 16:45
As-tu télécharger les fichiers JS ?
0
Réponse 2 / 7
jqr
5 déc. 2009 à 17:00
Oui
0
Réponse 3 / 7
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
Réponse 4 / 7
jqr
5 déc. 2009 à 18:13
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
Réponse 5 / 7
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
Réponse 6 / 7
jqr
5 déc. 2009 à 19:24
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
Réponse 7 / 7
jqr
6 déc. 2009 à 11:17
C'est bon sa fonctionne , c'était une erreur de JS.
0

Discussions similaires

les entrées et les sortées
oussman -
MarsuGL -

2 réponses
mon ordi marque press the esc key for startup menu
jasonparris -
elow -

5 réponses
Accéder au menu Advanced Bios PC portable HP
Axferd -
Bill -

6 réponses
Déblocage du mode hôtel Philips 20HF5234/10
Jo_3 -
TRAORE_2505 -

7 réponses