Forum - En vrac ! - bouton deroulant 1
le 13/12/2016 @ 15:02
par Tof
Bjr Jeandenis,
Grace à ton aide et après la modif de mon "fotorama" je m'attaque au bouton deroulant 1je souhaiterai que la barre de bouton reste transparente afin qu'elle s'integre bien dans mon sitepeux tu me dire comment faire STP car pour les essai je travail en local et lorsque j'arrive à ce que je veux je l’intègre aussitôt au sitemerci d'avance Tof
Tof
--------
le 13/12/2016 @ 17:27
par JeanDenis
Administrateur
Bonjour Tof,
Alors à supposer que tu aies récupéré les codes du tutoriel pour jouer avec.
Tu régleras la transparence des boutons ici :
#boite_deploiement h5 { /*attributs des titres des boutons*/
position:relative;
z-index:2; /* z-index supérieur superposant le bandeau déroulant */
font-weight:normal; /* ou bold */
font-size:1.4em; /*taille du texte*/
border:1px dotted #555555; /*bordure du bouton : épaisseur, nature, couleur*/
background:#888888; /*couleur de fond : mettre transparent */
border-radius:0px; /*arrondis*/
}
Cependant, le bandeau déroulant qui est normalement masqué par ce bouton sera un peu visible dans le bouton au moment du survol, ce n'est pas très joli, il faudra donc ajuster la hauteur de ce bandeau ici :
.deploiement div { /*Attributs du Bandeau déroulant*/
position:relative;
z-index:1; /* z-index inférieur à celui du bouton */
background:#000000; /*couleur du fond*/
padding:10px; /*marges intérieures du bandeau déroulant*/
margin-top:-40px; /*marge extérieure haute du bandeau déroulant, à ajuster pour être légèrement couvert par le bouton*/
font-size:1em; /*taille du texte*/
color:#eee; /*couleur du texte*/
border-radius:0px 0px 8px 8px; /*arrondis du bandeau déroulant, ici seulement en bas*/
transform:scaleY(0); /*échelle 0 : donc non visible*/
transform-origin:50% 0; /*déroulement au milieu à partir du haut*/
transition:all 0.5s ease; /*vitesse et mode de transition ease, linear, ease-in, ease-out...*/
}
Essaie de mettre -28px, à l'oeil, cela va, mais si tu changes d'autres éléments, il faudra peut-être aménager.
Cordialement,
Rectifier message Clôturer sujet Remonter