Div Coupe image en background (HELP PLZ)
christophe.therrien
Messages postés
108
Statut
Membre
-
yusukessj Messages postés 297 Statut Membre -
yusukessj Messages postés 297 Statut Membre -
Bonjour, j'essaye de mettre dans mon site internet un lien avec une image qui passe de noir et blanc à toute coloré lorsque l'on "hover" par dessus. Jusqu'à présent ça marche. le seul problème est que le div ou je ne sais trop quoi empêche l'image de s'afficher au complet. Pour un example, vous pouvez aller visiter ma page : www.tarentule-fitness.com/chris/tarentule/nouveau/index.php et vous pouvez voir le code.
Je vous met le code quand même.
Html :
<div id="courriel-border" ></div>
<div id="courriel"><a href="#"><span style=" height:200px;">COURRIEL</span></a></div>
Css :
#courriel-border {
position:absolute;
left: 768px;
top: 1318px;
border-color:#FFFFFF;
border:dashed;
border-width:3px;
border-spacing:inherit;
width:140px;
height: 45px;
z-index:0;
color:#FFFFFF;
}
#courriel {
position:absolute;
top:1282px;
left:741px;
z-index:1;
overflow:visible;
height: 96px;
}
#courriel a {
width:167px;
height: 243px;
z-index:1;
color:#FFFFFF;
text-align:right;
padding-left: 50px;
background: url(timbre-gris.png) no-repeat;
overflow:visible;
}
#courriel a:hover {
z-index:1;
color:#FFFFFF;
text-align:right;
padding-left:50px;
background: url(timbre-couleur.png) no-repeat;
}
Je vous met le code quand même.
Html :
<div id="courriel-border" ></div>
<div id="courriel"><a href="#"><span style=" height:200px;">COURRIEL</span></a></div>
Css :
#courriel-border {
position:absolute;
left: 768px;
top: 1318px;
border-color:#FFFFFF;
border:dashed;
border-width:3px;
border-spacing:inherit;
width:140px;
height: 45px;
z-index:0;
color:#FFFFFF;
}
#courriel {
position:absolute;
top:1282px;
left:741px;
z-index:1;
overflow:visible;
height: 96px;
}
#courriel a {
width:167px;
height: 243px;
z-index:1;
color:#FFFFFF;
text-align:right;
padding-left: 50px;
background: url(timbre-gris.png) no-repeat;
overflow:visible;
}
#courriel a:hover {
z-index:1;
color:#FFFFFF;
text-align:right;
padding-left:50px;
background: url(timbre-couleur.png) no-repeat;
}
Configuration: Mac OS X / Safari 532.9
A voir également:
- Div Coupe image en background (HELP PLZ)
- Légende image word - Guide
- Couper une image en 3 instagram - Guide
- Image iso - Guide
- Reduire taille image - Guide
- Windows 7 logon background changer - Télécharger - Thèmes & Fonds d'écran
1 réponse
Hello !
parlons du coté de Facebook :
CSS :
et du coté HTML :
Je vient d'ésséyer eet ça marche pour moi, je reste dans le coin si t'as des remarques ;-)
Cheers
parlons du coté de Facebook :
CSS :
.facebook {
position:absolute;
z-index:1;
top:1320px;
left:375px;
height:59px;
background: url(facebook-gris.png) no-repeat;
padding-left: 50px;
}
.facebook:hover {
background: url(facebook-couleur.png) no-repeat;
}
.facebook a {
width:100%;
height:100%;
z-index:1;
text-align:right;
padding-left:50px;
overflow:visible;
}
.facebook a:hover {
width:100%;
height:100%;
z-index:1;
text-align:right;
padding-left:50px;
}
et du coté HTML :
<a href="#" class="sous-titre"><div id="facebook" class="facebook">FACEBOOK</div></a>
Je vient d'ésséyer eet ça marche pour moi, je reste dans le coin si t'as des remarques ;-)
Cheers
