-
Mon premier code Javascript - afficher un message
Pour utiliser Javascript, il faut au préalable demander aux responsables de l'activer sur vos blog, en passant par le formulaire de contact.
Voici un petit code javascript qui affiche une fenêtre avec un message :
Cliquez sur « Exécuter ce code » en bas à droite du code ci-dessus pour l'exécuter.
Un petite fenêtre s'affiche :Le code javascript peut-être écrit à deux endroits dans Eklablog :
- dans une page ou un article ;
- dans un module.
Si vous insérez du code dans une page ou un article, il sera exécuté lors de l'affichage de cette page ou cet article.
Si vous insérez du code dans un module, il sera exécuté à l'ouverture du blog lors du chargement des modules.
Si vous avez activé la navigation Full-Ajax dans les paramètres du blog, le code présent dans les modules ne s'exécutera pas à chaque changement de page, car les modules ne sont alors pas rechargés systématiquement.
Dans un nouvel article, ajoutons ce code dans l'éditeur source HTML :
Code Javascript Tout sélectionner
<script>// <![CDATA[ alert ("Bonjour"); // ]]></script>
Sauvegarder et raffraîchir la page, la fenêtre qui s'affiche est (varie en fonction des navigateurs) :
Ce n'est pas tout à fait ce qu'on attend.
En fait la fenêtre vu précédemment (celle avec la barre de titre bleue) est une fenêtre créée par Eklablog en remplacement de la fenêtre standard.
Pour pouvoir l'utiliser, il faut attendre que le javascript du blog soit totalement chargé.Voici le code à utiliser :
Code Javascript Tout sélectionner
<script>// <![CDATA[ // Début du code Javascript if(typeof(onJSFilesLoaded) != "object") onJSFilesLoaded = []; onJSFilesLoaded.push(function(){ // Début du code au chargement alert ("Bonjour"); // Pour test // Fin du code au chargement }); // Début autres fonctions // Si vous avez d'autres fonctions... // Fin autres fonctions // Fin du code Javascript // ]]></script>
On s'assure ainsi que tout soit bien chargé avant d'exécuter notre code.
En général, on utilisera ce mécanisme qui permet d'attendre que toute la page soit chargée avant de faire des manipulations en javascript.
« Mon premier code CSS - images au coins arrondis avec ombrage[CSS] Les sélecteurs CSS, comment formater une liste hiérarchique ? »
-
Commentaires
Bonjour,
C'est possible en programmant une fonction plus complète que la fonction « alert » qui est très limitée.
Je prévois un article sur le sujet.
02 / 09 / 2016
Bonjour,
je signale une évolution d'Eklablog (fin 2015) qui n'est pas actuellement signalée dans l'article :
- il y a un 3ème emplacement pour écrire un code javascript : Apparence > zone de script (barre menu)
- Cette zone de script est intégrée directement dans la page html
- il existe maintenant une Version mobile qui ignore le thème CSS de la Version standard. Les modules sont ignorés, ainsi que les éventuels codes qu'ils contiennent)
- la zone de script accepte aussi du CSS (en utilisant les balises <style>..</style>). CSS qui sera chargé avec la page, dans les deux versions, mobile ou standard.
- du texte simple, écrit hors balises dans cette zone de script apparait en clair sous le pied de page (versions standard et mobile)
Merci -Thierry- pour les explications et annotations très pédagogiques
Bonjour et merci
En ce qui concerne la couleur du texte et la taille des caractères ?
Peut-on modifier cette couleur par exemple le mettre en rouge et passer en caractère taille 12?
Si oui comment et où placer le bout de css?
Merci de votre retour
Alheck
Ajouter un commentaire
Je trouve ce script très sympa mais y a-t-il moyen d'insérer une image dedans
et aussi que la fenêtre soit plus petite?