Sujet Précédent Sujet Suivant

[CSS] Probleme avec la propriete hover

Fermé
lolocatalan - 29 août 2012 à 21:06
 lolocatalan - 30 août 2012 à 23:03
Bonjour,
J'essaye désespérément de parvenir à faire un menu d'images pour mon site, ou le visiteur pourra voir l'article publié le plus récemment, et voir d'autre articles en cliquant sur les vignettes sur la droite, voici un petit screen pour illustrer la situation :
[URL=http://www.hostingpics.net/viewer.php?id=613603screen.png][IMG]http://img11.hostingpics.net/pics/613603screen.png/IMG/URL

Le probleme est le suivant :
Au survol de la souris sur une des 4 vignettes de droite, je suis parvenu a changer l'image principale par celle des vignettes, le souci c'est que ce changement n'est pas permanent : dès que l'on enlève la souri de la vignette, l'image s'enlève.
J'ai casiment tout essayé je pense en CSS et j'aimerais avoir votre avis ?
y a-t-il une solution a mon probleme ?


10 réponses

Réponse 1 / 10
jeremy.s
Messages postés
1226
Date d'inscription
lundi 28 mars 2011
Statut
Membre
Dernière intervention
2 septembre 2013
 80
29 août 2012 à 23:18
Bonsoir,

Le hoover se déclanche seulement quand la souris est dessus, comme tu l'as remarqué. Mais il n'est pas permanent comme tu le souhaite car justement le hoover fait juste le survole de la souris.
Mais tu voudrais que quand tu passes la souris sur une image de droite elle se mette en grand au milieu c'est ca ? Fait donc un clic, non ? Je ne comprend pas pourquoi tu veux changé l'image juste quand l'utilisateur déclanche le hoover ...
0
Réponse 2 / 10
lolocatalan
29 août 2012 à 23:25
Bonsoir, et merci pour ta réponse,
en fait quand je le configure au click (avec :active je crois) l'image en grand au milieu ne reste que quand le click est enclenché, moi je voudrais qu'une fois le click relâché, l'image reste, mais ça n'a pas l'air possible en CSS je suis en train de voir en Javascript.
Merci pour ton aide.
0
Réponse 3 / 10
jeremy.s
Messages postés
1226
Date d'inscription
lundi 28 mars 2011
Statut
Membre
Dernière intervention
2 septembre 2013
 80
29 août 2012 à 23:28
Mmh je crois que le active c'est autre chose effectivement. En css je pense pas que se soit possible ...
En js c'est facile ! Si tu n'arrives pas dit moi :)
0
Réponse 4 / 10
lolocatalan
30 août 2012 à 00:25
RE
J'ai enfin trouvé comment faire !!! (en javascript)
Je vais modifier mon site et je posterai le code ici après ;)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 10
jeremy.s
Messages postés
1226
Date d'inscription
lundi 28 mars 2011
Statut
Membre
Dernière intervention
2 septembre 2013
 80
30 août 2012 à 00:29
D'accord :)
Par contre je pense ne pas tardé à aller dormir, donc si jamais je répondrai demain !
Donc si jamais t'as une question encore ce soir je peux vite y répondre !
0
Réponse 6 / 10
lolocatalan
30 août 2012 à 00:43
c'est bon je vais me debrouiller tout seul pour ce soir tkt
merci je mettrais le code demain ;)
0
Réponse 7 / 10
jeremy.s
Messages postés
1226
Date d'inscription
lundi 28 mars 2011
Statut
Membre
Dernière intervention
2 septembre 2013
 80
30 août 2012 à 00:43
Ok bonne soirée à toi alors ! Et bon courage :)
0
Réponse 8 / 10
lolocatalan
30 août 2012 à 21:02
Desole pour le retard !
Pour ceux que ça interesserai d'avoir un menu en "carousel" comme le miens :
http://img11.hostingpics.net/pics/258199Capture.jpg

Voici les script à utiliser :
Pour le titre principal de l'image :
<script type="text/javascript"><!--
function afficheDescURL(toThis)
{
if (document.getElementById)
{
document.getElementById("pdescri").innerHTML = toThis;
}
else if (document.all)
{
document.all["pdescri"].innerHTML = toThis;
}
}


//--></script>


Pour la description de l'image :
<script type="text/javascript"><!--
function afficheDescURL2(toThis)
{
if (document.getElementById)
{
document.getElementById("titcar").innerHTML = toThis;
}
else if (document.all)
{
document.all["titcar"].innerHTML = toThis;
}
}


//--></script>


Pour le changement d'image au survol d'une des vignettes :
<script type="text/javascript">
function setstyle(numstyle){
if(numstyle==1){
document.getElementById("central").style.backgroundImage = 'url("images/nwo.jpg")';
}
else if(numstyle==2){
document.getElementById("central").style.backgroundImage = 'url("images/popo1.jpg")';
}
else if(numstyle==3){
document.getElementById("central").style.backgroundImage = 'url("images/monta.jpg")';
}
else if(numstyle==4){
document.getElementById("central").style.backgroundImage = 'url("images/monta2.jpg")';
}
}
</script>

pour ceux qui ne savent pas très bien utiliser Javascript (comme moi), renseignez vous un minimum à vous arriverez à faire pareil sans problemes !
0
Réponse 9 / 10
jeremy.s
Messages postés
1226
Date d'inscription
lundi 28 mars 2011
Statut
Membre
Dernière intervention
2 septembre 2013
 80
30 août 2012 à 22:53
Bien joué ! :)
0
Réponse 10 / 10
lolocatalan
30 août 2012 à 23:03
Merci man
0