Positionnement background image sur image existante en hover

Salut ,

on va parfois sur des sites de vidéos la liste des vidéos et lors du passage de la souris il sort un background contenant icone play sur l'image elle même

je sais pas comment le faire j'ai essayer de faire opacity sur l'image courante puis le faire un background avec icone play mais ça marche pas

je sais pas comment faire

merci

Marcel a écrit :
on va parfois sur des sites de vidéos la liste des vidéos et lors du passage de la souris il sort un background contenant icone play sur l'image elle même

Si c'est par-dessus l'image de contenu, ce n'est certainement pas une image de fond appliquée à cette image.

Ça peut se faire éventuellement avec un élément positionné en absolu (un SPAN vide par exemple avec l'image d'«overlay» comme image de fond). Ça demande bien sûr de maitriser le positionnement absolu (positionnement d'un élément par rapport aux limites d'un conteneur positionné).

Salut Florent ,

effectivement j'ai eu l'idée de positionnement absolu mais apparemment je devine comment l'intégrer en plus ma liste de vidéos est affiché à partir de base donnée interaction avec php
donc je réfléchis comment je peux faire en sorte que l'image background voici comme ça semble
http://img23.imageshack.us/img23/5940/videohovercq0.png

donc je sais pas vraiment comment le faire

merci

Marcel a écrit :
effectivement j'ai eu l'idée de positionnement absolu mais apparemment je devine comment l'intégrer en plus ma liste de vidéos est affiché à partir de base donnée interaction avec php
donc je réfléchis comment je peux faire en sorte que l'image background voici comme ça semble

Strictement rien compris à cette «phrase». N'hésite pas à nous la refaire en français.

La plupart des lecteurs vidéo sur le web sont en Flash à l'heure actuelle, nan ?
Vouloir faire un bouton play avec du CSS me semble un peu spécial.
Va voir cet exemple comme tu peu le voir, au passage de la souris (hover) un cadre opaque apparaît en bas, c'est peu être ce que tu cherche à faire ? Voici le tutoriel qui va avec.
Bon courage.
Modifié par Remay (15 Feb 2009 - 14:21)

salut ,

je m'excuse pour le retard , apparemment il semble que je suis mal exprimés
voici en détails situation courante :

j'ai une liste de news affiché à partir de la base donnée : les 6 derniers news
affiché sous forme d'un tableau
j'ai div de 405 px width : chaque image de news contient 180px ce qui veut dire l'affichage sera du genre


http://img11.imageshack.us/img11/3455/64983994.png

donc j'essaye de faire et de le transmettre c'est lorsque je veux par exemple voir la news 3 au survol de l'image qui est amène à la news 3 s'affiche une image un peu transparente qui comme icone play genre



http://img232.imageshack.us/img232/484/97093484.png

merci
Modifié par Marcel (01 Mar 2009 - 13:55)

quelqu'un a une idée ?

merci

salut,

tu peux faire deux images, l'original sans transparence et une autre transparente. et avec du css ça devrait aller.