[CSS] Probleme avec la propriete hover
lolocatalan
-
lolocatalan -
lolocatalan -
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 ?
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 ?
A voir également:
- [CSS] Probleme avec la propriete hover
- Enlever le soulignement d'un lien css ✓ - Forum Webmastering
- CSS/Comment enlever couleur liens ? ✓ - Forum CSS
- Css download - Télécharger - HTML
- Background color css ✓ - Forum CSS
- Comment créer un lien non souligné ✓ - Forum Réseaux sociaux
10 réponses
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 ...
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 ...
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.
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.
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 :)
En js c'est facile ! Si tu n'arrives pas dit moi :)
RE
J'ai enfin trouvé comment faire !!! (en javascript)
Je vais modifier mon site et je posterai le code ici après ;)
J'ai enfin trouvé comment faire !!! (en javascript)
Je vais modifier mon site et je posterai le code ici après ;)
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
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 !
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 !
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 !
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 !
