onclick, visibility....

onclick, visibility.... - HTML/CSS - Programmation

Marsh Posté le 26-07-2005 à 14:16:22    

Salut,
 
Je veux pouvoir masquer et afficher un bloc en cliquant sur du texte/image. Je savais pas trop comment faire donc j'ai cherché un peu sur le net et je suis tombé sur ce script :  
http://www.jsmadeeasy.com/javascri [...] mplate.htm
 
Ce que je veux correspond exactement à l'exemple avec visibility donc je m'attaque au décodage du source. Me souvenant avoir lu  que le document.all c'est pas bien, je met donc un getElementById :) Et voila le code que j'ai écrit :
 

Code :
  1. <p onclick="document.getElementById('todo_new_form').style.visibility= document.getElementById('todo_new_form').style.visibility=='hidden' ? '' : 'hidden'">New</p>
  2. ...
  3. <div id='todo_new_form'>
  4. <input type='text' name='todoText' value='' maxlength='60'>
  5. ...


 
Le hic c'est que 1, ca fait rien du tout quand je clic, 2, j'ai remarqué que le curseur changeait en curseur de sélection de texte alors que sur l'exemple ca fait pas ca...Je vois pas trop comment m'en sortir donc un coup de main ca serait appréciable :)
 
 
PS: Ca m'énerve ces sites censés proposer des tutoriaux qui sont codés le plus merdiquement possible. J'adore les couleurs pour les liens à la fois dans le body et dans un style :D Ca rassure, y'a pire que moi  :p  
 
 

Reply

Marsh Posté le 26-07-2005 à 14:16:22   

Reply

Marsh Posté le 26-07-2005 à 14:39:35    

ton code est correct, je ne vois pas ce qui te gène là
 
je viens de tester et ca marche nickel.
 
 
sinon remplace P par A c'est mieux  
tu met un <a href="javascript:document.getElem....">clic ici</a>

Reply

Marsh Posté le 26-07-2005 à 14:48:47    

'tain je comprend vraiment pas, ca me fait rien du tout........
J'ai remplacé par ca (j'imagine que c'était ca que tu voulais dire, pas le JS dans le href...)

Code :
  1. <a href='#' onclick="document.getElementById('todo_new_form').style.visibility= document.getElementById('todo_new_form').style.visibility=='hidden' ? '' : 'hidden'">New</a>


 
Et ca fait que dalle chez moi...
 
Chuis sous IE, xp sp2, y'a pas de raison qu'il me bloque le JS non ?
EDIT : En meme temps, si c'était ca, la page d'exemple me marcherait pas  :whistle:


Message édité par gooopil le 26-07-2005 à 14:54:17
Reply

Marsh Posté le 26-07-2005 à 16:02:08    

ah si, si tu ouvres ta pages par défaut sous IE SP2, il bloque le JS, faut cliquer sur la petite barre jaune pour activer le JS de la page

Reply

Marsh Posté le 26-07-2005 à 16:06:30    

Ben oui mais non, j'ai jamais eu besoin de cliquer pour accéder à d'autres sites avec du JS...Exemples :  
http://css.alsacreations.com/xmedi [...] popup1.htm
 
Ca marche niquel, pas de pb de JS
 
Ou si je met ca :  
<a href='#' onClick="alert('please')">New</a>
 
Pareil ca marche... :pt1cable:


Message édité par gooopil le 26-07-2005 à 16:08:36
Reply

Marsh Posté le 26-07-2005 à 16:12:34    

J'ai trouvé :D
 
Vu que par défaut je voulais que ca ne soit pas affiché, j'avais mis dans ma css :
 
#todo_new_form {
 visibility : hidden;
}
 
Si je vire ca, je peux afficher/enlever sans pb avec le lien...
 
 
Du coup ma question devient : comment expliquer ce comportement ? Je croyais pouvoir modifier le style de cette facon mais on dirait qu'une fois que c'est dans la css, c'est fixé...
Je cherche donc un moyen de masquer ca par défaut...

Reply

Marsh Posté le 26-07-2005 à 16:30:56    

non par défaut si tu lui met  
 

Code :
  1. #todo_new_form {
  2. visibility : hidden;
  3. }


 
document.getElementById('todo_new_form').style.visibility par défaut ne vaudra pas hidden, mais vide.

Reply

Marsh Posté le 26-07-2005 à 17:12:21    

Faut que je fasse comment alors ?

Reply

Marsh Posté le 26-07-2005 à 17:39:46    

J'me suis débrouillé du coup :
 
Au chargement de la page j'apelle une fonction JS qui va me cacher ces éléments. Du coup, ben si le JS est pas activé ca marche quand meme :)
 
Des commentaires sur ma méthode ?

Reply

Sujets relatifs:

Leave a Replay

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