Probléme de hover et de onmouseup sur des liens

[Résolu]
Signaler
Messages postés
9
Date d'inscription
vendredi 23 juillet 2004
Statut
Membre
Dernière intervention
1 septembre 2008
-
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
-
Salut la communauté

J'aimerai vous faire part d'un de mes probléme de développement en
html/css et j'ai intégré un peu de javascript aussi pour faire quelques
effets de rollover avec l'evement onmousedown. Tout mes efforts n'ont
pas aboutis.

Je vous exposes alors mon trouble :

j'ai une liste de lien dans une liste:

<li>[# énergie (1 articles)]</li>

et j'aimerai que lorsque je passe sur ma <li> le lien qui se
trouve dedans change de couleur. j'ai essayé avec le css mais ça ne
marche qu'avec du texte sans lien. Je ne vois plus vraiment comment
faire maintenant...

J'ai essayé de mettre ça : <li onmouseover="this.className =
'liendessus'" > [# mon lien ]</li>
mais il ne marche pas.

Auriez-vous des tuyos à me fournir ?

Votre aide me sera vraiment utile

12 réponses

Messages postés
9
Date d'inscription
vendredi 23 juillet 2004
Statut
Membre
Dernière intervention
1 septembre 2008

Ok j'ai fixé le truc. J'ai trouvé. En effet pas besoin de javascript, je m'y suis mal pris pour la gestion des liste. Au lieu de faire un li:hover il fallait rester sur le et tout faire dedans :

#liste ul{
list-style:none;
margin-left:2px;
padding-left:2px;
margin-right:2px;
padding-right:2px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
}

#liste ul a{
display:block;
height:15px;
background-color:#e7e7e7;
text-decoration:none;
color:#666666;
}
#liste ul a:hover{
background-color:#333333;
color:#FFFFFF;
}

Merci de votre aide :)
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
Bonjour,

    t'embête pas, fait ça en CSS sur les liens...

<style type="text/css">
 a:link    { text-decoration:underline;
             text-transform:capitalize;
             font-weight:normal;
             color:#FF0000; }
 a:visited { text-decoration:overline;
             font-weight:bold;
              color:#00FF00; }
 a:hover   { text-decoration:line-through;
             text-transform:uppercase;
             font-weight:bolder;
             background-color:#FFFF00; }
 a:active  { text-decoration:none;
             text-transform:lowercase ;
             font-weight:lighter;
             background-color:#CCFFFF; }
</style>

<hr />


Cordialement                        Bul         [mon Site]     [M'écrire]



<hr />
Messages postés
9
Date d'inscription
vendredi 23 juillet 2004
Statut
Membre
Dernière intervention
1 septembre 2008

Meri de ta réponse rapide,
mais dans mon css j'ai définis mes <li> avec une largeure de 250 px (donc fatalement plus large que je texte qui se trouve dedans). Et moi j'aimerai que le texte 'lien' qui se trouve dans le <li>[# mon texte]</li> change de couleur quand je passe sur la <li>.
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
mettre la même taille aux href.
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
peut-être pas été clair...
    width:250px dans le css a:
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
36
par exemple... on doit pouvoir trouver d'autres solutions.
si html/css font, il vaut mieux ce passer de tout code.
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
41
Salut
li > a{
display:block;
}

ca doit aussi marcher

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
41
Salut

sinon, t'aurais pu accepter les reponses qui t'ont permises d'arriver a la solution finale... et pas laisser croire que tu t'es debrouille seul...

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
9
Date d'inscription
vendredi 23 juillet 2004
Statut
Membre
Dernière intervention
1 septembre 2008

Heu ouai merci [auteurdetail.aspx?ID=229092 coucou747]pour le coup du display:block, mais il ne fallais pas le mettre sur les <li> mais sur les . Il me semblai qu'acepter une réponse c'était comme son nom l'indique "une réponse" et non un élément partiel de réponse. Bref pour conclure j'ai trouvé la soluce à mon probléme sur ce tuto : http://www.toutjavascript.com/savoir/savoir31.php3
Désolé pour ton ego coucou747.
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
41
Salut
#liste ul a{

la bonne blague...

apprend a coder, on en reparlera ensuite

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
9
Date d'inscription
vendredi 23 juillet 2004
Statut
Membre
Dernière intervention
1 septembre 2008

Bha écoute je ne prétent pas être aussi bon que toi en code, mais ça marche, c'est tout ce que je demande.
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
41
Salut

ton argument ne tient pas...

li > a{
display:block;
}

et

ul a{
display:block;
}

font la meme chose sur un html :

  <li>recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy