Bonjour,
Je souhaite appliquer un style css sur mon menu quand je survole mes sections et ce que je fais fonctionne lorsque je me déplace dans mes sections avec la molette de ma souris (même si je m'y prends mal) mais ce que je souhaite, c'est faire en sorte que cela fonctionne aussi bien en se déplaçant avec la barre de défilement.
Je vous remercie de me mettre sur la voie.
Mon jquery:
Mon css:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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 (function($){ $(document).ready(function() { $('#top-menu li.current-menu-item').first().addClass('active'); $('#top-menu li').removeClass('active'); $('#top-menu li a').click(function() { $('#top-menu li').removeClass('active'); $(this).parent().addClass('active'); }); }); })(jQuery); (function($){ $(document).ready(function(){ $('#methodologie').hover( function(event){ // console.log('hover, event : :'+event.type); $('body #menu-item-28661 a').toggleClass('link-active'); }); $('#prestations').hover( function(event){ // console.log('hover, event : :'+event.type); $('body #menu-item-28665 a').toggleClass('link-active'); }); $('#contact').hover( function(event){ // console.log('hover, event : :'+event.type); $('body #menu-item-28666 a').toggleClass('link-active'); }); }); })(jQuery);
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 #top-menu .active a{ color: #ff3036 !important; } .link-active { color: #fff !important; background: #ff3036 !important; border:1px solid #ff3036 !important; border-radius: 5px !important; padding: 7px 7px 7px 7px !important; margin-top:-7px !important; }
Partager