28172 sujets

CSS et mise en forme, CSS3

Salut,

J'aurai besoin d'avoir vos avis pour gérer quelque chose sur mon site qui est lié aux images.

Il s'agit d'un site de vente en ligne, pour mes articles j'ai donc une image, j’aimerais que :

- si la quantité est > 0 alors j'affiche l'image de mon article normalement
- si la quantité est < 0 alors j'affiche l'image de mon article normalement mais par dessus il faudrait qu'il y ai comme un deuxième calque avec écrit dans un coin "épuisé"

Comment faire cela automatiquement, sans faire toutes mes images en double et en utilisant du HTML/CSS ?

Merci d'avance
Salut.

Eh bien pour ta question je suppose qu'il y a plusieurs possibilités.

En imaginant que tu bosses en PHP (ou autre) pour la détection de ta quantité, il faudrait ajouter (dans le cas quantité=0) juste après ton image une div (ou une span) du genre :
<div class="articleEpuise">Épuisé</div>

... et le positionné au dessus de ton image.

Le plus simple serait que ton img soit dans un conteneur de même taille et en position relative pour simplifier le positionnement de ta div articleEpuise :

Voir ici -> http://jsfiddle.net/LzXcW/

Tu vois après pour personnalisé ta div.