Messages: 256

Enregistré le: 11 Fév 2003

Message le Jeu Aoû 19, 2004 15:42

Bonjour,

Je cherche desesperement, mais cela n est peut etre pas possible de creer un changement de couleur d un ligne d un table au survol de la souris.

J'arrive a le faire avec l association du JS par un onmouseover et onmouseout.

Es ce possible sans JS???

car ca alourdie la page inutilement, si on peut le definir une bonne fois pour toute dans le CSS par expl avec hover

:?:
Modifié en dernier par achaternet le Jeu Aoû 19, 2004 21:11, modifié 1 fois.
Haut
12 Réponses
Messages: 1604

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 15:44

Oui c'est tout à fait possible, mais IE lui ne sait pas faire...

IE ne gère le :hover que sur les liens.
Haut
Messages: 256

Enregistré le: 11 Fév 2003

Message le Jeu Aoû 19, 2004 15:54

Bool a écrit:Oui c'est tout à fait possible, mais IE lui ne sait pas faire...

IE ne gère le :hover que sur les liens.


Ya pas de soluce alors :?: (notamment pour IE)

Mon objectif, c est que ce soit compatible avec tous les navigateurs bien sur :)
Haut
Messages: 1604

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 16:06

Peux être avec "l'astuce" IE 7, mais je ne sais pas s'il gère les :hover
Haut
Messages: 1604

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 16:09

Je viens d'aller sur le site officiel, et il le gère : http://dean.edwards.name/IE7/

Mais attention : il s'agit en fait d'un package "Javascript" dédié à IE afin qu'il fonctionne comme tous les autres navigateurs (bah oui, c'est le seul navigateur actuel qui ne sait pas faire). Donc tu allègeras pour Google et les visiteurs ayant un vrai navigateur, mais tu allourdiras pour tous ceux qui ont IE.

PS : le gros avantage c'est de ne pas avoir à modifier ton code...
Haut
Messages: 256

Enregistré le: 11 Fév 2003

Message le Jeu Aoû 19, 2004 16:27

Merci bool

ca reste trop relou :!: :!:

sniff. :cry:
Haut
Messages: 1604

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 16:30

bah... de rien... désolé de ne pas avoir su t'aider
Haut
Messages: 477

Enregistré le: 27 Fév 2004

Message le Ven Aoû 20, 2004 0:07

Bon, c'est à base de javascript, mais ce sera certainement beaucoup moins lourd que ta solution actuelle...
En gros, ca simule un :hover pour IE, très utile!
J'utilise ce bout de code que j'appelle dans le onload du body pour faire un rollover sur les LI d'un menu sous IE. Ca marche très bien jusqu'à maintenant, suffit de l'adapter pour les TR (au moins 2 caractères à modifier...)

Code: Tout sélectionner
startList = function()
{
   if (document.all&&document.getElementById)
   {
      navRoot = document.getElementById("menu").childNodes[1];
      
      for (i=0; i<navRoot.childNodes.length; i++)
      {
         node = navRoot.childNodes[i];
         
         if (node.nodeName=="LI")
         {
            node.onmouseover=function()
            {
               this.className+=" over";
            }

            node.onmouseout=function()
            {
               this.className=this.className.replace(" over", "");
                  }
         }
      }
   }
}
window.onload=startList;


Ensuite, dans mon CSS, je déclare

Code: Tout sélectionner
#menu ul li:hover ul,#menu ul .over ul
{
   display:block;
}


Pour faire apparaitre un menu déroulant sur mon menu, reste plus qu'à adapter pour changer la couleur de fond (au moins une ligne à changer...)

En esperant que cette première piste te soit utile...
Haut
Messages: 3605

Enregistré le: 10 Fév 2004

Message le Ven Aoû 20, 2004 0:27

sinon, tu peux jouer avec la propriété background-color au niveau des liens. Ca marche sous IE et les navigateurs basés sur Gecko.
Haut
Messages: 855

Enregistré le: 31 Mai 2004

Message le Ven Aoû 20, 2004 1:17

Avec le display:block sur les liens, on peut aussi s'en tirer pas mal.
Haut
Messages: 3605

Enregistré le: 10 Fév 2004

Message le Ven Aoû 20, 2004 9:30

bastgau a écrit:Avec le display:block sur les liens, on peut aussi s'en tirer pas mal.


C'est à ça que je pensais : background-color + display:block. display:block ne marche pas sous IE4 mais au delà il n'y a pas de problème. Ca te fait des liens dont tout le fond se met dans la couleur de background quand tu passes au dessus. L'attribut display te permet de lui imposer de régler le background pour toute la largeur disponible, pas uniquement celle occupée par le lien. Tu as donc plus ou moins le même effet qu'en JS.
Haut
Messages: 1604

Enregistré le: 26 Fév 2004

Message le Ven Aoû 20, 2004 9:38

bastgau a écrit:Avec le display:block sur les liens, on peut aussi s'en tirer pas mal.

+1
Haut
Messages: 256

Enregistré le: 11 Fév 2003

Message le Ven Aoû 20, 2004 19:31

merci pour tes precisions ecocentric sur la compatibilité.


Plus precisement, ça donne ?


background-color + display:block

j'ai juste a modif mon css et dire que pour tous mes <tr> cette regle dans avec l action hover, et c tout??
Haut