Diaporama : changer l'image des vignettes

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Diaporama : changer l'image des vignettes

Message par alv le Mer 27 Fév 2013 - 11:17

Bonjour,
j'ai un code qui fonctionne très bien mais j'ai un petit soucis.
C'est un "diaporama" qui affiche des petites vignettes et au survol, la vignette s'affiche en grand avec le texte correspondant.
Comment faire que dans les petites vignettes, l'image ne s'y affichent pas. Je voudrais mettre une autre image : une image verte pour la vignette active et une blanche pour les inactives. Comment faire dans le code ?
Merci d'avance.


Dernière édition par alv le Sam 9 Mar 2013 - 10:15, édité 1 fois (Raison : résolu)
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Jeu 28 Fév 2013 - 19:26

Up Very Happy
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Ven 1 Mar 2013 - 19:52

Smile up
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Sam 2 Mar 2013 - 18:58

Up
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Dim 3 Mar 2013 - 19:15

Tssss
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Lun 4 Mar 2013 - 19:32

Up svp
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Mar 5 Mar 2013 - 19:21

aidez moi
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Mer 6 Mar 2013 - 19:49

Up Snifff
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Jeu 7 Mar 2013 - 19:51

Up svp
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Ven 8 Mar 2013 - 18:48

Up Sad
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par Scoubifitz le Ven 8 Mar 2013 - 22:04

bonsoir,
remplacez la partie "style" par celle ci :

Code:
<style type="text/css">
#view1{
/* Diapo */
width: 440px;
height: 220px;
border: solid 1px #41BB1E;
border-radius: 17px;
-moz-border-radius: 17px;
-webkit-border-radius: 17px;
padding: 0px;
}
.onglet1{
/* Vignettes et texte */
margin: 205px 0px 0px 40px;
}
.onglet-table1 img{
/* Vignettes */
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
padding: 0px 0px;
width: 0px;
height: 18px;
}
.onglet-table1 td.active, .onglet-table1 td:hover{
/* Vignette active */
opacity: 1;
background:#41BB1E;
border: solid 2px #41BB1E;
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
}
.onglet-table1 td{
/* Vignettes non actives */
opacity: 0.8;
background:#ffffff;
border: solid 2px #339966;
border-radius: 7px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
width: 18px;
height: 18px;
}
.onglet-content1 > div{
/* Texte */
display: none;
font-size: 13px;
color: white;
line-height: 1.8;
text-align: justify;
border: solid 0px;
padding: 5px;
width: 160px;
height: 210px;
margin: -233px 0px 0px 230px;
border-radius: 0px 17px 17px 0px;
-moz-border-radius: 0px 17px 17px 0px;
-webkit-border-radius: 0px 17px 17px 0px;
background-image: url('XXX.png');
background-repeat:no-repeat;
}
.onglet-content1 > div.active{
display: block;
}
.onglet-table1{
border-spacing: 2px;
}
</style>
avatar

Scoubifitz
Membre actif

Masculin
Messages : 3535
Inscrit(e) le : 18/03/2008

http://scoubidous.superforum.fr/
Scoubifitz a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Diaporama : changer l'image des vignettes

Message par alv le Sam 9 Mar 2013 - 10:14

Merci, nickel.

merci résolu
avatar

alv
Membre habitué(e)

Messages : 1276
Inscrit(e) le : 09/07/2012

http://urlz.fr/2OYC
alv a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum