Messages: 256

Enregistré le: 11 Fév 2003

Message le Jeu Aoû 19, 2004 14: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 20:11, modifié 1 fois.
Haut
12 Réponses
Messages: 1598

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 14: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 14: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: 1598

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 15:06

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

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 15: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 15:27

Merci bool

ca reste trop relou :!: :!:

sniff. :cry:
Haut
Messages: 1598

Enregistré le: 26 Fév 2004

Message le Jeu Aoû 19, 2004 15:30

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

Enregistré le: 27 Fév 2004

Message le Jeu Aoû 19, 2004 23: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: 3593

Enregistré le: 10 Fév 2004

Message le Jeu Aoû 19, 2004 23: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: 854

Enregistré le: 31 Mai 2004

Message le Ven Aoû 20, 2004 0:17

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

Enregistré le: 10 Fév 2004

Message le Ven Aoû 20, 2004 8: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: 1598

Enregistré le: 26 Fév 2004

Message le Ven Aoû 20, 2004 8: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 18: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