cellule cliquable

cellule cliquable - HTML/CSS - Programmation

Marsh Posté le 05-06-2006 à 12:04:15    

bonjour,
Voila j'ai créé un tableau dans lequel j'ai plusieur objet.
Maintenant je voudrais que pour certaine cellule ou il y a du texte un l'interieur, on puisse cliquez dessus.
Je ne veu pas seulement que se soit mon text qui soit un lien mais toute mas cellule.
Je ne trouve pas de reponse sur google pour le langage html, quelq'un a t'il une idée ou peut etre n'est ce pas possible ?
 
Merci d'avance.

Reply

Marsh Posté le 05-06-2006 à 12:04:15   

Reply

Marsh Posté le 05-06-2006 à 12:15:27    

Code :
  1. <script type="text/javascript">
  2. window.onload = function() {
  3. // definir element_td
  4. elements_td = document.getElementById('id_de_la_table').getElementsByTagName('td');
  5. for (i=0 ; i<elements_td.length) {
  6. elements_td[i].onclick = function() {
  7. // le code a éxecuter si on clique sur la cellule
  8. }
  9. }
  10. }
  11. </script>


Il te faut définir element_td pour que cela fonctionne.
Pour cela il te faudra utiliser une solution a base de getElementById et/ou getElementsByTagName, etc ... pour pointer le ou LES cellules sur lesquelles affecter le traitement. Bref il faut avoir quelques bases Javascript pour y arriver.


Message édité par afbilou le 05-06-2006 à 12:22:08
Reply

Marsh Posté le 05-06-2006 à 12:26:22    

tu as pas plus moche comme méthode ?
 
suffit de modifier l'affichage du <a> via css :o

Reply

Marsh Posté le 05-06-2006 à 13:44:08    

l'affichage du <a> via css euh tu peu m'exlpiqué un peu

Reply

Marsh Posté le 05-06-2006 à 13:51:46    

KangOl a écrit :

tu as pas plus moche comme méthode ?
suffit de modifier l'affichage du <a> via css :o


C'est pas forcément "moche" comme tu le dis! Si le clic sur la cellule lance une fonction javascript c'est même mieux, puisque ces evenements ne seront gérés que si le js est activé sur le poste client.
 

ma_mat44 a écrit :

l'affichage du <a> via css euh tu peu m'exlpiqué un peu


tu mets des balises A dans tes TD, avec comme style: display à block, height et width à 100%
 

Reply

Marsh Posté le 05-06-2006 à 13:53:41    

J'ai bien fait comme tu me la di mais il n'y a que le text de cliquabl le reste de ma cellule ne l'ai pas,
voila mon code
 

Code :
  1. <td><a href="http:..." STYLE="display:block" width="100%" height="100%"
  2. target="_blank" TITLE="..."><font face="Arial, Helvetica, sans-serif"><strong>PLAYER</strong></font></a></td>


Message édité par ma_mat44 le 05-06-2006 à 14:18:22
Reply

Marsh Posté le 05-06-2006 à 14:21:18    

height et width sont aussi des propriétés CSS, la balise <a> n'a pas d'attributs height et width.

Reply

Marsh Posté le 05-06-2006 à 14:35:53    

et profites en pour mettre aussi la font et le bold dans ton style.
Pis tu peux aussi eviter d'utiliser _blank, pour un "nom à toi", histoire que tous tes liens ne s'ouvrent pas dans une nouvelle fenetre...

Reply

Marsh Posté le 05-06-2006 à 14:36:49    

oui j'avais corrigé par moi meme cette erreur maintenant la zone cliquable est bien comme je la voulais mais mon text ce colle en haut de la cellule et je n'arrive pas a le centrer haut milieu est ce normal? ou ais encor fai une erreur?
 
en plus jsui sur c une tite connerie genre un valign="middle" mais je ne trouve pas ou le mettre...
 

Code :
  1. <td height="20%" vertical-align="middle"><a href="http://www..." STYLE="display:block; width:100%; height:100%" target="_blank"
  2. TITLE=".."><font face="Arial, Helvetica, sans-serif"><strong>PLAYER</strong></font></a></td>


 
et merci pour les bonné idée (_blank ...)


Message édité par ma_mat44 le 05-06-2006 à 14:52:18
Reply

Marsh Posté le 06-06-2006 à 14:48:25    

je n'ai toujour pas trouvé d'ou peut venir le probleme...
Le text de ma cellule de veux pas s'aligner au centre de ma cellule verticalement pourtant j'ai bien mis les valign="middle" mais rien ne se passe une idée sur l'erreur ?
 

Code :
  1. <td height="20%" width="20%" valign="middle"><a href="http://www..."
  2. STYLE="display:block; height:100%; width:100%; text-decoration: none" target="_blank" TITLE="...">
  3. <font color="#000000" face="Arial, Helvetica, sans-serif" align="center"><strong>PLAYER</strong></font></a></td>


Message édité par ma_mat44 le 06-06-2006 à 14:49:09
Reply

Marsh Posté le 06-06-2006 à 14:48:25   

Reply

Marsh Posté le 06-06-2006 à 15:07:13    

Si tu commençais par corriger ce que l'on te conseille (je en l'occurnece), tu t'interesserais alors aux css et tu trouverais rapidement la réponse à ta question tout seul(ce qui est quand même plus valorisant).

Reply

Marsh Posté le 06-06-2006 à 15:17:39    

bein je ne vois pas ce que cela change pour cela.
Biensur c'est plus clair ca je n'en doute pas mais dans mon css il faudra bien que je declare la valeur vertical-align:middle ou text-align ce que j'ai deja testé et qui n'a rien donnée.
Alors a defaut de me valorisé je demandai pour savoir si quelqu'un connaissait la solution ou avait deja eu ce probleme car ca fai un moment que je sui dessus mais qu'en tu ne trouve pas tu ne trouve pas ...


Message édité par ma_mat44 le 06-06-2006 à 15:27:28
Reply

Marsh Posté le 06-06-2006 à 15:38:16    


 
combien a peu pres en € ? :d
sinon moi je lis rien

Reply

Marsh Posté le 06-06-2006 à 16:18:13    

ça ne changera rien en mettant un vertical-align sur le TD puisque maintenant c'est ton A qui prend toute la hauteur du TD :o
faudrait alors mettre un line-height sur le A (en lui filant la hauteur du TD en pixel (je sais c'est crade mais c'est comme ça.
 
au passage tu me vire ta balise font de merde et ton strong qui servent à rien.
 
et tu rajoutes dans les styles du A :  
color:#000000; font-family:Arial, Helvetica, sans-serif; text-align:center; font-weight:bold


---------------
Blablaté par Harko
Reply

Marsh Posté le 06-06-2006 à 17:58:42    

j'ai trouvé une methode bien plus simple si quelqu'un a un jour le meme probleme que moi la voici:
 

Code :
  1. <td width="20%" height="20%" class='bg1' onmouseover='this.className="bg3"; this.style.cursor="hand";'
  2. onmouseout='this.className="bg1";' onclick='window.open("http://..." )' TITLE="...">PLAYER</a></td>


merci javascript ...

Message cité 1 fois
Message édité par ma_mat44 le 06-06-2006 à 17:59:12
Reply

Marsh Posté le 06-06-2006 à 19:41:58    

ma_mat44 a écrit :

j'ai trouvé une methode bien plus simple si quelqu'un a un jour le meme probleme que moi la voici:
 

Code :
  1. <td width="20%" height="20%" class='bg1' onmouseover='this.className="bg3"; this.style.cursor="hand";'
  2. onmouseout='this.className="bg1";' onclick='window.open("http://..." )' TITLE="...">PLAYER</a></td>


merci javascript ...


 
merci ie qui n implemente pas correctement les css [:aloy]
la classe :hover est applicable a tous les elements ...en principe :/
 
 

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed