Images en lignes qui défilent lorsque l'on utilise la souris
Résolu
Gboa
Messages postés
9
Date d'inscription
Statut
Membre
Dernière intervention
-
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention -
Bonjour à tous,
Je suis en train de construire mon propre site internet. J'ai eu qq cours d'HTML à l'école, mais trop peu pour pouvoir tout maîtriser. J'utilise également les styles CSS.
J'ai déjà la base de mon site : une colonne à gauche où se trouve le menu, et le reste de la fenêtre, que j'ai appelé "corps", à droite où j'aimerais que s'affiche les images.
Je souhaiterais que celles-ci s'affichent en ligne et qu'elles défilent mais seulement en utilisant une barre de défilement située sous la fenêtre de la page web, et non quelles défilent toutes seules. Il faudrait que la colonne menu à gauche reste visible, et donc que les images passent "en dessous".
J'ai essayé de m'aider d'Internet pour trouver le bon code mais sans succès.
Pour information, :
.corps {
position : fixed;
margin-left : 20%;
top : 0px;
width:100%;
height:100%;
min-height:750px;
padding-top:50px;
}
#colonne {
position:absolute;
top:0px;
left:0px;
width:10%;
min-width:17em;
height:100%
}
Je suis vraiment débutante, soyez indulgent si jamais j'ai commis des erreurs ou que je mets un peu de temps à comprendre ;)
Merci à vous de votre aide, et bon dimanche !
Je suis en train de construire mon propre site internet. J'ai eu qq cours d'HTML à l'école, mais trop peu pour pouvoir tout maîtriser. J'utilise également les styles CSS.
J'ai déjà la base de mon site : une colonne à gauche où se trouve le menu, et le reste de la fenêtre, que j'ai appelé "corps", à droite où j'aimerais que s'affiche les images.
Je souhaiterais que celles-ci s'affichent en ligne et qu'elles défilent mais seulement en utilisant une barre de défilement située sous la fenêtre de la page web, et non quelles défilent toutes seules. Il faudrait que la colonne menu à gauche reste visible, et donc que les images passent "en dessous".
J'ai essayé de m'aider d'Internet pour trouver le bon code mais sans succès.
Pour information, :
.corps {
position : fixed;
margin-left : 20%;
top : 0px;
width:100%;
height:100%;
min-height:750px;
padding-top:50px;
}
#colonne {
position:absolute;
top:0px;
left:0px;
width:10%;
min-width:17em;
height:100%
}
Je suis vraiment débutante, soyez indulgent si jamais j'ai commis des erreurs ou que je mets un peu de temps à comprendre ;)
Merci à vous de votre aide, et bon dimanche !
A voir également:
- Images en lignes qui défilent lorsque l'on utilise la souris
- Quelle touche pour débloquer la souris ? - Guide
- Partager photos en ligne - Guide
- Qui utilise mon wifi - Guide
- Des images - Guide
- Mètre en ligne - Guide
3 réponses
Bonjour
le principe est de faire ce que l'on appelle un design horizontal
body {
height:100%;
}
.corps {
margin-left : 10%;
top : 0px;
width:XXXXpx;
min-height:100%;
padding-top:50px;
}
#colonne {
position:fixed;
background-color:#FFFFFF;
top:0px;
left:0px;
width:10%;
min-height:100%
}
dans .corps a width tu mets le width de toutes les images mises bout a bout exemple si tu as 10 images de 300px de large plus une marge de 100px par exemple a droite de chaque image ca donneras
width:4000px;
voila apres a toi d'adapter ce principe
le principe est de faire ce que l'on appelle un design horizontal
body {
height:100%;
}
.corps {
margin-left : 10%;
top : 0px;
width:XXXXpx;
min-height:100%;
padding-top:50px;
}
#colonne {
position:fixed;
background-color:#FFFFFF;
top:0px;
left:0px;
width:10%;
min-height:100%
}
dans .corps a width tu mets le width de toutes les images mises bout a bout exemple si tu as 10 images de 300px de large plus une marge de 100px par exemple a droite de chaque image ca donneras
width:4000px;
voila apres a toi d'adapter ce principe