Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1697 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  effet surbrillance sur un tableau ???

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

effet surbrillance sur un tableau ???

n°1066566
donny3
Posté le 30-04-2005 à 11:02:44  profilanswer
 

Salut,
 
Je souhaiterais realisé un tableau qui contienne les elements de ma base de donnée ,puis à partir de ce tableau j aimerais que lorsque je passe le curseur de la souris dessus une ligne du tableau que cette ligne soit en surbrillance(quelle change de couleur) et que lorsque je clique sur cette ligne , je transfere les elements de cette ligne sur un autre formulaire.
 
Je vois vraiment pas comment faire
si vous pouviez m aider
Merci d avance à tous

mood
Publicité
Posté le 30-04-2005 à 11:02:44  profilanswer
 

n°1066614
pmusa
▓▓▓▓▓▓▓
Posté le 30-04-2005 à 11:41:07  profilanswer
 

pour l'effet de surbrillance, le CSS fera très propre.  [:aras qui rit]  
tu te fait par exemple une classe speciale --> .surbrillance { }
et tu la rend effective pour tes cellules du tableau soit:

Code :
  1. .surbrillance td {
  2. background-color: white;
  3. // là tu specifie un background
  4. }


 
puis lorsque le curseur survole la cellule avec hover:

Code :
  1. .surbrillance td:hover {
  2. background-color: silver;
  3. // là tu specifie un background lorsque le curseur passe dessus.
  4. }


 
 
Après pour le formulaire je vais laisser les habitués repondre je suis pas casé.  :jap:

n°1066642
FlorentG
Posté le 30-04-2005 à 12:02:00  profilanswer
 

Note que la solution de pmusa ne fonctionnera pas sous Internet Explorer, mais on s'en balance ;) Utilise-la telle quelle :jap:

n°1066883
donny3
Posté le 30-04-2005 à 15:39:53  profilanswer
 

le truc c est que j utilise internet explorer

n°1066889
donny3
Posté le 30-04-2005 à 15:48:29  profilanswer
 

et ce qu il y a c est que je ne connais pas trop les css tu serai ou je pourrai trouver des exemple SVP
hover ?je vois se que c est

n°1066899
pmusa
▓▓▓▓▓▓▓
Posté le 30-04-2005 à 16:06:57  profilanswer
 

avec du JS ça doit bin être possible mais moi et le JS on fait pas la paire. :/ et pis le JS c'est mal.
hover c'est un apocope pour "hand over" (main dessus). la main c'est ton curseur.
 
sinon tu peux aussi utiliser FF. http://www.designlaboratory.net/smileyyyy/mimi.gif

n°1066902
donny3
Posté le 30-04-2005 à 16:08:39  profilanswer
 

je voulais dire je vois pas ce que c est hover
et FF c est quoi ?
et je peux avec les css faire apparaitre une nouvellepage quand je clique sur la ligne du tableau

n°1066912
pmusa
▓▓▓▓▓▓▓
Posté le 30-04-2005 à 16:17:02  profilanswer
 

FF = FireFox, le navigateur qui vous veut du bien.
le CSS sert uniquement pour formater la presentation de ta page. Tu peux pas faire ce genre de truc avec du CSS. si tu veux ouvrir une nouvelle fenêtre il te faudra du JS ( JavaScript ) -->  
OnClick="window.open()" et ses paramètres. je ne saurai t'en dire plus, je ne suis pas LA reference...
je ne sais pas dans quel contexte tu veux appliquer ça (surtout une cellule  :??: ) mais tu peux te debrouiller avec target="_blank" (c'est mal je sais. http://www.designlaboratory.net/smileyyyy/ilestla.gif)

n°1067536
Huitzilopo​c
Posté le 01-05-2005 à 11:32:40  profilanswer
 

Salut donny3,
il y a longtemps j'ai utilisé ce script (mélange de javascript et de css).
le problème c'est que celui-ci est très répétitif (donc lourd à mettre en place).  :heink:  
il s'applique à la balise "td", voici le code :

Code :
  1. <td bgcolor="#F1F2F3" width="100%" border="0" onmouseover="this.style.background='#FFFFFF'" onmouseout="this.style.background='#F1F2F3'">Blablabla</td>


A toi de voir si tu le juges utiles, à priori il marche sur tous les navigateurs (testé sous IE5, IE6 et FireFox).
Pour le transfert sur un formulaire, tu peux utiliser un script php qui envoie toutes les données dans l'adresse vers la page du formulaire et dans les "input" ou "area" tu mets la variable en question dans la propriété "value='$exemple'". je ne cerne pas assez ton idée pour bien me prononcer là dessus.
A la prochaine !  
Huitzi

n°1067547
masklinn
í dag viðrar vel til loftárása
Posté le 01-05-2005 à 12:01:25  profilanswer
 

pmusa a écrit :

avec du JS ça doit bin être possible mais moi et le JS on fait pas la paire. :/ et pis le JS c'est mal.


Non, le JS c'est très bien, simplement il faut l'utiliser correctement [:spamafote]  

Huitzilopoc a écrit :

Salut donny3,
il y a longtemps j'ai utilisé ce script (mélange de javascript et de css).
le problème c'est que celui-ci est très répétitif (donc lourd à mettre en place).  :heink:  
il s'applique à la balise "td", voici le code :

Code :
  1. <td bgcolor="#F1F2F3" width="100%" border="0" onmouseover="this.style.background='#FFFFFF'" onmouseout="this.style.background='#F1F2F3'">Blablabla</td>



Dégage avec ton code de merde [:mmmfff]  
 
Donny > pour le transfert d'informations d'un endroit à un autre, c'est obligatoirement du JS et c'est pas une bonne idée (~10% des gens surfent avec le JS désactivé), pour la surbrillance CSS + un peu de JS pour MSIE et ça roule.
 
Maintenant la question: pourrait-on avoir un exemple précis, histoire de comprendre ce que tu veux transférer comme informations et à quelles fins


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
mood
Publicité
Posté le 01-05-2005 à 12:01:25  profilanswer
 

n°1067565
Ayuget
R.oger
Posté le 01-05-2005 à 12:36:19  profilanswer
 

Le JS pour ce type d'effet pas du tout indispensable à la navigation, c'est bien [:spamafote] (enfin c'est sûr que si on peut s'en passer autant le faire hein...)
 
Avec le code CSS posté plus haut, ca changera bien la couleur de toute la ligne? Je peux me tromper, mais il me semble que seule la case courante changera de couleur.

n°1067658
cerel
Posté le 01-05-2005 à 15:10:41  profilanswer
 

Utilise "tr" si tu veux que toute la ligne change de couleur et non pas uniquement la cellule.
 
Et puis faudrait arreter de diaboliser le JS.
Le JS est parfois la seule solution pour faire certains trucs.
Le probleme du JS c'est qu'il n'y a pas beacoup de monde qui sait bien l'utiliser, et qu'il existe beacoup de sites qui proposent des scripts totalement merdiques.
Du coup le JS a une mauvaise reputation :/
 
Allez un petit lien interessant :
JavaScript: The World's Most Misunderstood Programming Language


Message édité par cerel le 01-05-2005 à 15:10:57
n°1067671
masklinn
í dag viðrar vel til loftárása
Posté le 01-05-2005 à 15:26:45  profilanswer
 

Ayuget a écrit :

(enfin c'est sûr que si on peut s'en passer autant le faire hein...)


C'est le contraire :o
 
À part dans certains cas bien spécifiques, le Javascript ne doit exister que quand on peut s'en passer (aka que le fait qu'il soit désactivé ou non supporté par le navigateur courant ne gêne pas), il est là pour améliorer l'expérience de l'utilisateur et DOIT être optionnel.
 
Je te conseille l'article Progressive Enhancement and the Future of Web Design, il est extrèmement intéressant et instructif, très bien pensé.

cerel a écrit :

Le probleme du JS c'est qu'il n'y a pas beacoup de monde qui sait bien l'utiliser, et qu'il existe beacoup de sites qui proposent des scripts totalement merdiques.
Du coup le JS a une mauvaise reputation :/


 :jap:  

Citation :

Allez un petit lien interessant :
JavaScript: The World's Most Misunderstood Programming Language


J'le connais celui là [:gilbert gosseyn]  
 
À visiter également, Tuto Javascript de How To Create et l'impressionnant Quirksmode (HTML/CSS assez moyen, mais j'ai jamais vu un site d'aussi haut niveau en quantité et qualité d'informations sur le JS [:jofusion] )
 
Il est également possible de visiter Novemberborn (allez visiter les archives) et si vous avez quelques semaines de libres le blog de Simon Willison a non seulement d'excellents articles mais également des blogmarks et des liens vers divers blogs assez hallucinants [:youpi] c'est une sorte de bookmark à bookmarks [:huit]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1070917
donny3
Posté le 03-05-2005 à 19:58:34  profilanswer
 

Merci de m avoir repondu
en faite je veux realiser une interface pour base donnée
et a l instar de access je voudrai creer des tableaux dans des formulaires et lorsqu on clique sur la ligne bin sa ouvre une nouvelle fenetre avec les donnée de ligne et alors on peux les modifier dans la base de donnée par la suite

n°1070983
donny3
Posté le 03-05-2005 à 21:14:12  profilanswer
 

J ai fait cela comme lu vu que je n y connais pas grand chose

Code :
  1. <html>
  2. <head>
  3. <script langage="javascript">
  4. </script>
  5. </head>
  6. <body>
  7. <table>
  8. <tr>
  9. <td bgcolor="#F1F2F3" width="100%" border="0" onmouseover="this.style.background='#FFFFFF'" onmouseout="this.style.background='#F1F2F3'">Blablabla</td>
  10. </tr>
  11. </table>
  12. </body>
  13. </html>


 
il n y aurai pas une option qui permette de laisser la ligne ou la cellule en surbrillance quand on clique dessus.
 

n°1087085
Huitzilopo​c
Posté le 17-05-2005 à 18:34:43  profilanswer
 

Salut donny, c'est re-moi. je suis tombé par hasard, sur un script JavaScript qui devrait bien t'interesser.  

Code :
  1. <script language="Javascript">
  2. function Fondcouleur(){
  3. TR = document.getElementsByTagName('tr');
  4. n  = TR.length;
  5. for(i=0; i<n; i++){
  6. TR[i].onclick = function(){
  7. this.bgColor = (this.bgColor=='')?'#cccccc':'';
  8. }}}
  9. </script>
  10. <body onload="Fondcouleur()">
  11. <table width="100%">
  12.   <tr>
  13.     <td>1</td>
  14.     <td>Première ligne</td>
  15.   </tr>
  16.   <tr>
  17.     <td>2</td>
  18.     <td>Deuxième ligne</td>
  19.   </tr>
  20.   <tr>
  21.     <td>3</td>
  22.     <td>...</td>
  23.   </tr>
  24. </table>


Voilà, à la prochaine. :jap:  

n°1087102
masklinn
í dag viðrar vel til loftárása
Posté le 17-05-2005 à 18:44:06  profilanswer
 

Huitzilopoc a écrit :

Salut donny, c'est re-moi. je suis tombé par hasard, sur un script JavaScript qui devrait bien t'interesser.  

Code :
  1. ...


Voilà, à la prochaine. :jap:


 :sweat:
 
Wai, le code de merde et le surlignage non désactivable


Message édité par masklinn le 17-05-2005 à 18:45:07

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1087544
robbyone
Non pas !
Posté le 18-05-2005 à 10:44:33  profilanswer
 

Un petit mix des deux (JS et CSS)
 

Code :
  1. <tr class="color1" onmouseover="surligne(this)" onmouseout="surligne(this)" onclick="selectLigne(this, arg1, ...)">


 
avec les fonctions :
 

Code :
  1. function surligne( thisOBJ)
  2. { if( thisOBJ.className=='color1')
  3.        thisOBJ.className='color2';
  4.   else thisOBJ.className='color1';
  5. }
  6. function selectLigne( thisOBJ, arg1, ...)
  7. { surligne( thisOBJ);
  8.   ...
  9. }


 
La même fonction pour onmouseover et onmouseout avec un petit test d'état.
Et passage d'argument pour la seconde fonction pour faire tout ce que tu voudras ...
 
Bon courage.


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  effet surbrillance sur un tableau ???

 

Sujets relatifs
Aligner tableau en hautcast tableau/ vecteur
Afficher le contenu d'un tableau en plusieurs pages???pb while dans tableau - Débutant
tableau 100% sa marche mais euuuuh lire pour comprendre le prob ...lien englobant un tableau
SWT / TableauLancer une macro après modification d'un tableau croisé?
existence valeur dans un tableau ?fonction qui renvoie un tableau de données
Plus de sujets relatifs à : effet surbrillance sur un tableau ???


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR