En poursuivant votre visite de ce site, vous acceptez l'utilisation de cookies pour permettre ses différents services. Voir les Mentions légales.
 
 
 
Vous êtes ici :   Accueil » Forum » En vrac ! » bouton deroulant 1
 
 
 
    Imprimer la page...
    Imprimer la section...

Forum - En vrac ! - bouton deroulant 1


Nombre de membres 56 membres
Connectés : ( personne )
Snif !!!
 

clos par JeanDenis le 15/03/2017 @ 05:25  Sujet n° 18

le 13/12/2016 @ 15:02
par Tof

Tof

1 message

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

Site web Tof
sujet clos Haut  
Réponse n° 1
--------
le 13/12/2016 @ 17:27
par JeanDenis

JeanDenis

Administrateur
32 messages

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,

Site web JeanDenis
clos par JeanDenis le 15/03/2017 @ 05:25 Haut  
actif sujet actif   clos sujet clos   Important! Important!   Nouveau Nouveau message
Rectifier Rectifier message   Clôturer Clôturer sujet   Remonter Remonter  
Catégories de discussion  Forum