Bonjour,
J'ai utilisé la méthode des popups javascript d'alsacreations en modifiant quelque peu son principe de fonctionnement.
Pour mon application, j'avais besoin d'une astuce pour cacher des blocs de commentaires optionnels sur un gros formulaire et les afficher si besoin en cliquant sur leurs labels. Ca permet un affichage plus lisible en réduisant la barre de défilement verticale.
Ca marche très bien et c'est codé de manière à afficher les textarea si le navigateur a le javascript désactivé.
Petit soucis, ça créait un petit sursaut à l'affichage, le temps que le javascript masque les textarea et j'aimerais savoir si il existe une méthode en javascript pour afficher une barre de chargement le temps que les commentaires soient masqués.
Le javascript.
Le css (juste pour montrer que c'est bien le javascript qui change l'attribut display)
L'html
Merci.
P.S : Je sais pas si c'est sémantique d'utiliser une liste dans un formulaire mais c'est dans le cadre d'une application pro qui sera entre les mains d'un utilisateur connu avec une installation locale de php/mysql et firefox. C'était surtout pour éviter la lourdeur des tableaux.
Modifié par mangafan (09 Sep 2006 - 17:20)
J'ai utilisé la méthode des popups javascript d'alsacreations en modifiant quelque peu son principe de fonctionnement.
Pour mon application, j'avais besoin d'une astuce pour cacher des blocs de commentaires optionnels sur un gros formulaire et les afficher si besoin en cliquant sur leurs labels. Ca permet un affichage plus lisible en réduisant la barre de défilement verticale.
Ca marche très bien et c'est codé de manière à afficher les textarea si le navigateur a le javascript désactivé.
Petit soucis, ça créait un petit sursaut à l'affichage, le temps que le javascript masque les textarea et j'aimerais savoir si il existe une méthode en javascript pour afficher une barre de chargement le temps que les commentaires soient masqués.
Le javascript.
<script type="text/javascript">
<!--
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=20; i++) {
if (document.getElementById('comm'+i)) {document.getElementById('comm'+i).style.display='none';}
}
if (d) {d.style.display='block'; d.focus();}
}
window.onload = montre;
//-->
</script>
Le css (juste pour montrer que c'est bien le javascript qui change l'attribut display)
.comm textarea {
width: 100%;
}
L'html
<ul class="bloc">
<li class="inv"><!-- Inventaire --></li>
<li class="obs"><!-- Observation --></li>
<li class="etat"><!-- Etat générale --></li>
<li class="comm">
<label onclick="javascript:montre();">- Commentaires</label>
/
<label onclick="javascript:montre('comm1');">+ Commentaires</label>
<textarea name="comm1" id="comm1"></textarea>
</li>
</ul>
Merci.
P.S : Je sais pas si c'est sémantique d'utiliser une liste dans un formulaire mais c'est dans le cadre d'une application pro qui sera entre les mains d'un utilisateur connu avec une installation locale de php/mysql et firefox. C'était surtout pour éviter la lourdeur des tableaux.
Modifié par mangafan (09 Sep 2006 - 17:20)