Menu jquery et css

Version imprimable

Menu jquery et css

Bonjour

Je réalise un menu avec jquery

Voici le code
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <script src="jquery-2.1.1.min.js"></script> <script> $('#menu li').hover(function(){ $('ul:first',this).css({visibility:"visible"}).fadeln(600).show(); },function(){ $('ul:first',this).css({visibility:"hidden"}); }); </script>
Il ne fonctionne pas, je ne vois pas d'où vient le problème.

Peut être vient il du css.

A bientôt

09/08/2014, 11h16
sekaijin

Merci de poster les question JQuery dans le forum JQuery
10/08/2014, 06h33
argon

Bonjour

Désolé, on ne voix pas tout de suite qu"il ya un forum Jquery.

http://www.casimages.com/img.php?i=1...5349650405.png

A+

Bonjour

Exemple :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<ul id="menu">
    <li>
        Menu 1
        <ul class="smenu">
            <li>
                Sous menu 1.1
            </li>
        </ul>
    </li>
    <li>
        Menu 2
    </li>
    <li>
        Menu 3
        <ul class="smenu">
            <li>
                Sous menu 3.1
                 <ul class="smenu">
                    <li>
                        Sous menu 3.1.1
                    </li>
                    <li>
                        Sous menu 3.1.2
                    </li>
                </ul>
           </li>
        </ul>
    </li>
</ul>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
$( function(){ // forme abrégée de $(document).ready(function(){
 
    /*
     * Sans le CSS et le code HTML c'est "devinez ce que j'ai fait et ce que je voulais faire" !
     * 
     * Supposons que lors du survol (hover), les événements mouseenter et mouseleave servent 
     * à cacher ou montrer le sous-menu (class smenu) attaché à ce "li".
     */
 
    $( ".smenu" ).hide();
 
    $( "#menu" ).find( "li" ).hover(
        function(){
            $( this ).children( ".smenu" ).fadeIn( 600 );
        },
        function(){
            $( this ).children( ".smenu" ).fadeOut( 600 );
        }
    ); 
 
});

15/08/2014, 07h17
argon

Bonjour

Ca fonctionne

Merci.

Pourriez vous rajouter le lien jquery pour éviter de refaire la même erreur

JavaScript, AJAX, TypeScript & Dart + jquery

A bientôt
15/08/2014, 09h16
danielhagnoul

Citation:

Envoyé par argon

Pourriez vous rajouter le lien jquery pour éviter de refaire la même erreur

JavaScript, AJAX, TypeScript & Dart + jquery

:calim2:

"http://www.developpez.net/forums/f1188/webmasters-developpement-web/javascript-ajax-typescript-dart/javascript/bibliotheques-frameworks/jquery/"