Trucs & Astuces
Durant les différents projets que j'ai pu réaliser, j'ai été amené à
réfléchir sur la conception et la réalisation de petits modules qui permettent d'améliorer
l'ergonomie d'une application et d'optimiser les traitements internes à ces modules. Cette section consistera
donc à lister certains de ces modules en les décrivant brièvement. Les codes sources sont
disponibles grâce au lien de téléchargement présent sur chaque module.
Menu déroulant en Javascript
Nombreux sont les sites qui proposent des menus déroulant et certains d'entre vous aimeraient bien en faire autant. Le principe des menus déroulant réside dans le fait qu'il faut mêler Javascript et CSS. La solution que je propose consiste à éditer le code HTML de tous les menus (statiques et déroulants) sur la même page. Ensuite il suffit d'associer un style aux menus déroulants grâce à CSS et d'ajouter dans ce style la ligne suivante : display: none;, ce qui permet de ne pas afficher le menu déroulant lors du chargement de la page. Enfin, pour ce qui est du Javascript, il faut utiliser la méthode getElementById pour récupérer le menu déroulant que l'on veut afficher, puis affecter la valeur block à la propriété de style display de celui-ci. Javascript permet d'intervenir sur le style grâce à la propriété style d'un quelconque élément d'une page. L'exemple à télécharger affiche un menu avec deux menus déroulants : un simple et un double.
Insérer un document Flash sous Internet Explorer
Lorsque l'on intègre un document Flash dans une page d'un site Web, grâce aux balises HTML suivantes :
- <embed>...</embed>
- <object>...</object>,
Internet Explorer nous oblige à activer ActiveX avant de pouvoir interagir sur le document. Durant un stage concernant le développement Web, j'ai été amené à contourner ce problème. La solution est d'utiliser le Javascript pour écrire le code HTML correspondant à l'insertion du document Flash dans la page.
Ajouter du texte à la position courante du curseur
La plupart des forums de discussion proposent l'ajout de smileys lorsque l'utilisateur saisi son commentaire. Cela consiste en l'ajout des balises HTML correspondants au smiley dans l'espace réservé à la saisie du commentaire. Le problàme avec ce système, c'est que le texte s'ajoute en début ou en fin de commentaire. Lors de la création d'un site Web, j'ai traité ce problème pour que le texte s'ajoute là où se trouve le curseur. Par la suite, j'ai étendu cela en utilisant une fenêtre popup. Par exemple, pour la création d'une liste, l'utilisateur doit saisir l'intitulé de la liste ainsi que le contenu de chaque élément de celle-ci. Comme les traitements se déroulent sur le navigateur de l'internaute, le langage utilisé est donc le Javascript. Malheureusement, ce code souffre des problèmes de compatibilité avec certains navigateurs, notamment Mozilla Firefox.
Ajouter des champs dans un formulaire
Lorsque l'on crée un formulaire en HTML et que celui-ci requiert ou propose des saisies multiples pour un méme intitulé, il peut être intéressant d'ajouter un bouton à ce formulaire qui permettra d'ajouter des champs de saisie à cet intitulé. Le fichier à télécharger utilise la propriété «innerHTML» du langage Javascript. Cette propriété permet de récupérer et d'affecter du code HTML.