Z-index et empillement d'élément.
Yopli
Messages postés
73
Date d'inscription
Statut
Membre
Dernière intervention
-
Yopli Messages postés 73 Date d'inscription Statut Membre Dernière intervention -
Yopli Messages postés 73 Date d'inscription Statut Membre Dernière intervention -
Bonjour cher communauté de CCM,
J'ai un soucis qui peut paraitre rikiki mais qui me pose un sacré problème en ce moment.
Je cherche un moyen de développer une petite boite flottante sur des images de profiles lors d'un passage de souris dessus.
La condition : Que la boite flottante n'empiète pas sur l'élément sélectionné mais apparaisse devant les autres.
Un petit schéma pour illustrer mes propos qui peuvent ne pas être très clair :
mon code est de la forme suivante :
HTML
J'ai tenter le z-index mais son fonctionnement à ses particularités qui ne me permettent pas de manoeuvré comme je le veux.
Merci d'avance !
J'ai un soucis qui peut paraitre rikiki mais qui me pose un sacré problème en ce moment.
Je cherche un moyen de développer une petite boite flottante sur des images de profiles lors d'un passage de souris dessus.
La condition : Que la boite flottante n'empiète pas sur l'élément sélectionné mais apparaisse devant les autres.
Un petit schéma pour illustrer mes propos qui peuvent ne pas être très clair :
mon code est de la forme suivante :
HTML
<a href="" class="profil">
<span class="boite-flottante">John Doe</span>
<img src="..." alt="...">
</a>
J'ai tenter le z-index mais son fonctionnement à ses particularités qui ne me permettent pas de manoeuvré comme je le veux.
Merci d'avance !
A voir également:
- Z-index et empillement d'élément.
- Code ascii de a à z - Guide
- Index téléphonique - Guide
- Gpu z - Télécharger - Informations & Diagnostic
- Cpu z - Télécharger - Informations & Diagnostic
- Telecharger index - Télécharger - Gestion de fichiers
1 réponse
Salut,
pourtant:
http://www.w3.org/wiki/CSS/Properties/z-index
z-index permet bien d'indiquer des couches successives en profondeur, c'est donc vous qui ne savez as vous en servir.
Dans votre cas (superposition d'une seule couche) je vois pas l'intérêt d'utiliser la profondeur de a page.
Les éléments se masquent lorsqu'il ont des positions qui les font se chevaucher dans l'ordre indiqué par leur balises.
Donc si vous indiquez dans le flux(ordre des balises) votre élément qui doit rester dessus après l'élément dessous(ou dans d'autre container) il n'y a pas à se poser de question.
pourquoi faire compliqué et devor utiliser le css tandis que
<infobox>
</infobox>
<lien>
</lien>
résout votre problème en ayant seulement à indiquer le CSS pour que l'infobox soit à droite par la méthode de positionnement qui vous convient.
pourtant:
http://www.w3.org/wiki/CSS/Properties/z-index
z-index permet bien d'indiquer des couches successives en profondeur, c'est donc vous qui ne savez as vous en servir.
Dans votre cas (superposition d'une seule couche) je vois pas l'intérêt d'utiliser la profondeur de a page.
Les éléments se masquent lorsqu'il ont des positions qui les font se chevaucher dans l'ordre indiqué par leur balises.
Donc si vous indiquez dans le flux(ordre des balises) votre élément qui doit rester dessus après l'élément dessous(ou dans d'autre container) il n'y a pas à se poser de question.
pourquoi faire compliqué et devor utiliser le css tandis que
<infobox>
</infobox>
<lien>
</lien>
résout votre problème en ayant seulement à indiquer le CSS pour que l'infobox soit à droite par la méthode de positionnement qui vous convient.
mettez votre .boite-flottante en position absolute sur le hover avec left et top
sinon pour info z-index ne s'applique qu'avec des élément positionnés (relative, fixed ou absolute) la valeur la plus grande se place par dessus la valeur la plus peitie