28172 sujets

CSS et mise en forme, CSS3

Bonjour,
J'essaye de faire apparaitre une lueur externe sur un rool-over . L'image du bas et l'image original et celle du haut celle lors du roll-over et du clic sur le bouton. Je ne sais pas comment faire. Est ce que je doit faire ma div avec la hauteur de la première image et ensuite l'agrandir ?
ou une autre technique

Merci d'avance


upload/20958-alsa.jpg
Salut,

Il faut que tes toutes tes images soient à la taille de la plus grande d'entre elles, à savoir celle avec ton halo lumineux. Ensuite il s'agit de faire une substitution de l'une des images pour l'autre.
Mikachu a écrit :
il s'agit de faire une substitution de l'une des images pour l'autre.

Ladite substitution s'effectuant en JavaScript.
Hello,

Euh,

Tu dois pouvoir recréer l'effet que tu indiques (ou un très proche) sans passer par une image, juste avec les propriètées CSS3 de box-shadow. Ca ne passera pas partout, mais ce n'est pas très grave pour un effet secondaire comme celui-ci.

Si tu tiens à avoir exactement cet effet, partout, tu dois passer par une solution en image effectivement. Soit tu crée deux images, une pour chaque effet, et tu indique dans ton code des dimensions correspondant à la plus grande des deux.
Tu indique alors le background-image de l'effet au repos et tu change pour le background-image de l'effet au survol quand nécessaire.

Encore mieux, tu cumules les deux images en un sprite et tu ne fais varier que le background-position. Cela ne permettra d'afficher l'effet sans clignotement entre les deux la première fois.

Et tu n'a pas forcément besoin de Javascript pour ça. Les pseudo-classes :hover (au survol) et :active (au clic) suffisent amplement.
Tymlis a écrit :
Et tu n'a pas forcément besoin de Javascript pour ça. Les pseudo-classes :hover (au survol) et :active (au clic) suffisent amplement.

Euuuh et l'accessibilité ? Smiley rolleyes
Bonjour,
Merci pour vos réponses.
Alors javascript ? ou CSS avec survol ? je sais pas quelle solution choisir Smiley biggol
Bonjour,

Javascript est à utiliser si tu veux substituer une image à une autre (avec les textes). CSS pourra être utilisé si tu utilise box-shadow ou si tu substitues juste le fond de l'image (sans les textes).