TR HOVER dans phpMyAdmin

par **dev75** » 02 oct. 2007, 09:24

Ça veut donc dire que dans ton template, tu dois indiquer la couleur d'arriêre-plan dynamiquement dans le gestionnaire d'évènement de la même manière que tu le fais déjà pour la ligne normale. Saisis-tu le principe ?

Enfin il y a quand meme un soucis, ici c'est smarty qui genere l'alternance dans les balises TD. Je ne vois pas comment modifier le onmouseout

Code : Tout sélectionner

 {foreach from=$fact2 item=i}
<tr bgcolor="{ cycle values="#eeeeee,#d0d0d0" }"  
onmouseover="this.style.backgroundColor='#9ff'"  
onmouseout="this.style.backgroundColor='#efefef'">
<td>{$i.f0}</td> 
<td>{$i.f1|}</td> 
</tr>{/foreach} 
</table>

par **Cyrano** » 02 oct. 2007, 07:53

Ça veut donc dire que dans ton template, tu dois indiquer la couleur d'arriêre-plan dynamiquement dans le gestionnaire d'évènement de la même manière que tu le fais déjà pour la ligne normale. Saisis-tu le principe ?

par **dev75** » 02 oct. 2007, 07:36

As-tu testé le code que j'ai indiqué dans un navigateur ?

oui
je me suis trompé

<tr bgcolor="#d0d0d0">..
<tr bgcolor="#eeeeee">..

une ligne sur deux est coloré, par smarty.
En ajoutant ton code ca marche bien sauf que la couleur ne reviens pas quand le pointeur sort du champs. si je fixe une couleur de sortie sur onmouseout, cela ne pourra pas marcher, car une ligne sur deux change. Il aurait été plus simple si Js permetais de reinitialiser la couleur.

par **Cyrano** » 02 oct. 2007, 06:40

As-tu testé le code que j'ai indiqué dans un navigateur ?

par **Invité** » 01 oct. 2007, 21:32

Et à ton avis à quoi sert le "onmouseout" ?

oui je comprends, mais si la couleur de fond change une fois sur deux ?

Code : Tout sélectionner

<tr bgcolor="#d0d0d0">..
<tr bgcolor="#d0d0d0">..

par **Cyrano** » 01 oct. 2007, 19:35

Et à ton avis à quoi sert le "onmouseout" ?

par **dev75** » 01 oct. 2007, 19:27

Pour une ligne de tableau, je suggèrerais l'utilisation d'un gestionnaire d'évènement onmouseover et oumouseout afin de modifier dynamiquement la couleur d'arrière-plan de la ligne.

Quelque chose du genre :
Code : Tout sélectionner
<table summary=""> <tr style="color: #000; background-color: #efefef;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#efefef'"> <td><p>Bla bla quelconque pour meubler cette illustration.</p></td> </tr> <tr style="color: #000; background-color: #fff;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#fff'"> <td><p>Bla bla quelconque pour meubler cette illustration.</p></td> </tr> <tr style="color: #000; background-color: #efefef;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#efefef'"> <td><p>Bla bla quelconque pour meubler cette illustration.</p></td> </tr> </table>

Cette solution me plait bien, mais y a t'il une solution pour que la couleur d'origine quand on sort du focus, revienne ?
Car j'ai un tableau avec une alternance de couleur (odd,even).

par **Cyrano** » 01 oct. 2007, 19:14

Pour une ligne de tableau, je suggèrerais l'utilisation d'un gestionnaire d'évènement onmouseover et oumouseout afin de modifier dynamiquement la couleur d'arrière-plan de la ligne.

Quelque chose du genre :

Code : Tout sélectionner

<table summary="">
  <tr style="color: #000; background-color: #efefef;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#efefef'">
    <td><p>Bla bla quelconque pour meubler cette illustration.</p></td>
  </tr>
  <tr style="color: #000; background-color: #fff;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#fff'">
    <td><p>Bla bla quelconque pour meubler cette illustration.</p></td>
  </tr>
  <tr style="color: #000; background-color: #efefef;" onmouseover="this.style.backgroundColor='#9ff'" onmouseout="this.style.backgroundColor='#efefef'">
    <td><p>Bla bla quelconque pour meubler cette illustration.</p></td>
  </tr>
</table>

par **dev75** » 01 oct. 2007, 19:04

Attention, la pseudo-classe :hover ne fonctionnera que pour les liens hyper-texte sous IE qui ne l'interprète que partiellement.

Voir ici.

Merci

il faut que je rajoute

Code : Tout sélectionner

a span{
    background-color:#FFC;
}
a:hover span{
    background-color:#FCC;
}

Mais que va devenir mon code précedent ?
Dois je faire un remplacer tout ou faut il que j'ajoute ce supplement ? et donc polluer le code html pour etre compatible FF et IE ?

par **Cyrano** » 01 oct. 2007, 18:57

Attention, la pseudo-classe :hover ne fonctionnera que pour les liens hyper-texte sous IE qui ne l'interprète que partiellement.

Voir ici.

par **dev75** » 01 oct. 2007, 18:25

Oups, voici le code simplifié

Mon CSS

Code : Tout sélectionner

tr:hover {
    background: #69F;
    color: white;
    font-weight: bolder;
}

Code : Tout sélectionner

<tr onclick="location.href='tel.php?$id', target='_blank';" >
        <td>$nom</td>
        <td>$prenom</td>
</tr>

Je viens de m'apercevoir que l'effet dans phpmyadmin etait encore plus sympa, c'est a dire qu'en plus la ligne est selectionné quand on clique dessus.
J'aimerais bien refaire la meme chose.[/code]

par **Hubert Roksor** » 01 oct. 2007, 18:07

sous Firefox ca marche

Et ça marche comment ? Tu n'expliques pas comment tu fais.

par **dev75** » 01 oct. 2007, 17:42

Bonjour,

Je n'arrive pas à reproduire l'effet TR HOVER, qui fait surligné la ligne complete quand on passe la souris dessus.
J'ai fait le miens
Autant sous Firefox ca marche, mais sous IE6 rien.

Je sais qu'il y a une incompatibilité mais je n'arrive pas a comprendre pourquoi ca marche pourtant dans le cas de phpMyAdmin.

Merci de vos lumieres.

TR HOVER dans phpMyAdmin

Répondre

Étendre la vue Revue du sujet : TR HOVER dans phpMyAdmin

Re: TR HOVER dans phpMyAdmin

TR HOVER dans phpMyAdmin