28173 sujets

CSS et mise en forme, CSS3

Bonjour,



j'aimerai faire un scroll vertical avec mon menu qui est situé dans une colonne à gauche et qui est un conteneur div.

j'aurais voulu aussi qu'il ne commence pas tout dessus de la page c-à-d par exemple que le menu quand j'arrive soit à 200px du top et une fois que je descend il se retrouve en haut de la page. Je ne sais pas si je suis assez clair.

Mais pour être franc je n'ai rien su code appart mon conteneur div qui contient les liens mais pour le scrolling je suis completement perdu et je n'ai pas trouvé de code pour m'aider.

Si quelqu'un pourrait éclairer ma lanterne, cela serait très amical.

Merci d'avance pour toutes informations.

Au début je voulais réupper ce sujet : http://forum.alsacreations.com/posting.php?action=newp&tid=14177&fid=5&p=1 mais il est fermé.
Bonjour,

ssch3 a écrit :
Je ne sais pas si je suis assez clair.

Sans doute pas assez, effectivement.

Donc, pour être un peu méthodique:
1 - Comment doit être positionné ton menu au chargement de la page?
2 - Doit-il rester fixe, toujours visible au même endroit sur l'écran, ou bien défiler en même temps que la page?
3 - Est-ce que le comportement souhaité ne correspond à aucun des deux cas de figure cités en (2)?
Donc enfet au démarrage de ma page mon menu se situe à 200px du top et à 15px de la gauche.

Ce que j'aurais voulu c'est q'une fois que l'on descend la page et qu'on se retrouve plus bas que le top du menu, par exemple qu'on se retrouve à 210px plus bas, le menu descende de 10px afin qu'on le voit toujours dans son entierté. Maintenant je ne sais pas si cela est possible en css :s .

Donc je dirais pour le point 2 , qu'il doit défiler avec la page.

Merci Smiley cligne
ssch3 a écrit :
Ce que j'aurais voulu c'est q'une fois que l'on descend la page et qu'on se retrouve plus bas que le top du menu, par exemple qu'on se retrouve à 210px plus bas, le menu descende de 10px afin qu'on le voit toujours dans son entierté. Maintenant je ne sais pas si cela est possible en css :s .

Non, ce n'est pas possible de cette manière en CSS.

Ce que tu peux faire en CSS (pour les navigateurs récents uniquement: IE7, Firefox, Opera, Safari...), c'est avoir un menu en positionnement fixe (position: fixed), ce qui donnera ceci:
- ton menu est positionné à sa place dans le flux ou bien par des coordonnées par rapport aux bords du viewport (zone de visualisation), disons dans le deuxième cas à 200px du haut et 15px de la gauche;
- lorsque tu fais défiler la page, le menu reste toujous à 200px du haut du viewport et à 15px de la gauche du viewport: le reste de la page défile, mais pas le menu.

Si tu veux un comportement fixe «conditionnel» (par exemple: le bloc est positionné à 200px du haut du canevas, puis il remonte lorsqu'on fait défiler la page, mais au moment de sortir du canevas il devient fixe...), ça ne pourra pas se faire en CSS ou juste avec les CSS. Il y a des scripts Javascript qui font ce genre de chose, il me semble.