Discussion :

[Casey_Garraty]

Bonjour a tous,

Je dois faire un roll over sur une image pour lui donner un espèce d'effet "voilé" mais le problème c'est que ça ne marche pas héhé...je n'arrive pas a voir l'image du dessous. (pareil pour un autre roll over avec du texte cette fois ci) j'ai tout tenter rgba, opacity... je ne sais plus quoi faire. je vous met toutes les infos.

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
						<a href="#">
						<figure>
							<div class="roll"></div>
							<figcaption><img src="img/contenu-img-1.jpg" width="370px" height="273px" alt="img1" class="img1"></figcaption>
						</figure>
						</a>

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
.roll {
	width:370px;
	height:273px;
	background-color:rgba(10, 10, 10, 0.5);
	margin:40px 10px 0 20px;
	float: left;
 
}

le roll over en question :





Et cette fois ci je ne risque pas de trouver en 5minutes toute seule (voir post précédent ahem...)
Si quelqu'un peu m'aider ça serait sympa, ce truc me rend dingue depuis deux jours.
merci !

[Bisûnûrs]

Hello,

Ca serait pas plus facile de mettre une opacité plus faible directement sur le hover de l'image ?

Genre :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
.img1 {
    background: #666;
}
 
.img1:hover {
    opacity: .5;
}

[Casey_Garraty]

Ça ne marche pas malheureusement...

[NoSmoking]

Bonjour,
et si tu nous montrais ce que tu as essayé et qui ne marche pas

[albedo0]

Bonjour,

Voici un exemple fonctionnel : https://jsfiddle.net/braz79cj/

à adapter évidemment...