Bonjour à tous,
J'ai souvent utilisé les scripts (qu'on trouve aisément sur le net) permettant de bloquer un div/menu au scroll. Çela a toujours fonctionné.
Mais sur ma page actuelle, impossible de fixer le div #menu. J'ai vu et revu (changer) les CSS, idem pour le HTML, changer de script. Rien à faire.
Mon dernier espoir (avant développez.com) était "sticky-master". Idem.
Les CSS :
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13 #menu { background: #bada55; color: white; font-family: Droid Sans; font-size: 18px; line-height: 1.6em; font-weight: bold; text-align: center; padding: 10px; text-shadow: 0 1px 1px rgba(0,0,0,.2); width:100%; box-sizing:border-box; }
Le HTML :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12 <header class="header"> <h1>Titre<span>sous-titre</span></h1> <div id="menu"> <ul> <li><a href="../index.html">Intro</a></li> <li><a href="../europeens.html">Européens</a></li> <li><a href="../americains.html">Américains</a></li> <li><a href="../dedicaces.html">Dédicaces</a></li> <li><a href="../presse.html">Presse</a></li> <li><a href="../divers.html">Divers</a></li> </ul></div></header>
Et le JS :
Merci pour votre aide et bonne journée,
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6 <script type="text/javascript" src="jquery.sticky.js"></script> <script> $(window).load(function(){ $("#menu").sticky({ topSpacing: 0 }); }); </script>
dh
Partager