T U T O R I E L J A V A S C R I P T ( E S 6 )
|
|
|
- Céline Beaupré
- il y a 6 ans
- Total affichages :
Transcription
1 T U T O R I E L J A V A S C R I P T ( E S 6 ) Javascript est un langage de script (interprété au fur et à mesure). Il est supporté par les navigateurs web récents. Il peut donc être utilisé lors de la navigation sur les pages web par la plupart des personnes. Une grande partie du javascript est comprise par les navigateurs. Cependant, chaque navigateur propose des fonctionnalités qui leur sont propres. Ceci rend difficile la réalisation de pages web incluant du javascript fonctionnant sur tous les navigateurs, quelques soit le système d exploitation. Il existe heureusement des éléments fonctionnant à peu près partout. Ce sont donc ceux-ci que nous allons découvrir, petit à petit. Dans l ordre, nous verrons : comment insérer un peu de javascript, comment javascript manipule les pages web et comment réaliser une petite animation en javascript. Notons que les seuls outils dont vous ayez besoin sont : un navigateur web qui interprète le javascript et dont l interprétation est activée (ce qui est le cas par défaut des navigateurs comme firefox, internet explorer, safari, opéra, google chrome, etc.) et d un éditeur de texte. Pour commencer, téléchargez l archive contenant toutes les pages html à modifier. Pas besoin d un serveur web pour ce tutoriel, une édition «locale» suffit. INSERER DU JAVASCRIPT DANS UNE PAGE HTML Le code javascript peut être écrit dans la page elle-même grâce à la balise «<script type="text/javascript">» et. Cette balise peut être placée dans l entête ou dans le corps de la page. Il peut y avoir autant de ces balises que nous le souhaitons dans une page. Une balise et ne peut pas contenir que du code javascript. Pour commencer, nous allons faire apparaître une petite fenêtre (popup) avec du texte. Copiez dans le presse papier (ctrl+c ou menu édition / copier) le code suivant dans le fichier premierpage.html : alert("bonjour et bienvenue sur ma page! ") ; Collez le dans le fichier premierpage.html dans l entête de la page (entre la balise «<head>» et «</head>»). Ouvrez votre fichier dans votre navigateur. Qu observez-vous? Voyez-vous le reste du document avant de cliquer sur «ok»? Le code javascript s exécute au fur et à mesure qu il est lu dans la page. Déplacez ce morceau de code dans le corps de la page : d abord entre la ligne «<p>ceci marque le début de la page</p>» et la ligne «<h1>insertion de javascript</h1>», rechargez votre page, que constatez-vous?
2 puis juste avant la ligne «<p>ceci marque la fin de la page</p>», rechargez votre page, que constatez vous? et finalement juste après la ligne «<p>ceci marque la fin de la page</p>», rechargez votre page, que constatez vous? La fonction javascript «alert» est une des fonctions qu offre javascript. Nous l utilisons ici car son effet est immédiat. Il est bien sûr possible de faire beaucoup plus, comme avec la plupart des langages de programmation. Par exemple, nous allons définir une fonction (grâce au mot-clef function) qui calcule la circonférence d un cercle et l utiliser avec différentes valeurs de rayons. Dans l entête du fichier premierepage.html, copiez le code suivant : function circonference(rayon) return 2*Math.PI*rayon; Cette fonction prend un paramètre, rayon, et donne le résultat de la multiplication de ce rayon par 2π. La valeur de π est donnée par la constante (incluse dans javascript) «Math.PI», la multiplication est simplement notée par le symbole «*». Recopier le code suivant n importe où dans le corps de la page : alert("la circonference d un cercle de rayon 3m est de "+circonference(3)+ " m") ; Le signe «+» sert ici à concaténer deux chaines de caractères. Une chaîne de caractère, c est du texte (manipulée par un programme). La concaténation, c est simplement ajouter du texte à un autre. Rechargez votre page est observez le résultat. Nous allons maintenant appeler cette fonction grâce à une variable, «x». Recopier le code suivant dans le corps de la page premierepage.html : x = 0; x = 1; x = 2; x = 3; x = 4; x = 5; Rechargez la page et observez le résultat.
3 En fait, les langages de programmation, javascript inclus, permettent de faire évoluer les valeurs plus facilement que de recopier plusieurs fois la même ligne de code qui varie peu. Le code suivant est équivalent au code précédent, comme une boucle «for» standard : for(x = 0; x <= 5; x = x+1) Remplacez le dernier code que vous avez inclus et remplacez le par son équivalent avec la boucle «for». Rechargez la page et observez le résultat. Modifiez la partie «x = x + 1» par «x = x +0.5» et observez le résultat. Javascript propose d autres façons de faire des itérations, comme des «foreach» pour des tableaux : tableauderayon = [0, 0.5, 1, 1.5, 2.66, 42]; tableauderayon.foreach(rayon => alert("la circonference d'un cercle de rayon "+rayon+"m est de "+circonference(rayon)+ "m")); Dans cet exemple, il y a différentes notions à retenir : les tableaux : [ valeur, valeur, ] les «arrow function» ( paramètre => la fonction), dans le cas particulier où la fonction ne fait qu une ligne la méthode foreach sur les tableaux, qui permet d en parcourir les valeurs Nous avons vu comment mettre du javascript dans la page web. Cependant, à chaque fois, nous avons utilisé une fenêtre autre que la page. Maintenant, nous allons voir comment insérer le javascript dans la page elle-même. JAVASCRIPT ET LA PAGE WEB DOCUMENT.WRITE : ECRITURE DE MORCEAU DE HTML EN JAVASCRIPT Il est possible d écrire du html via javascript. A quoi cela sert-il? A gérer du contenu qu il est impossible de mettre à jour continuellement, comme la date et l heure ou à générer du contenu qu il serait pénible (copier coller répétitif) à écrire en html. Récupérez la page deuxiemepage.html. Pour commencer, ajoutons la date et l heure «</h1>» et «</body> :
4 time = new Date(); document.write("<p>nous sommes le "+time.getdate()+" / "+(time.getmonth()+1)+"</p>"); document.write("<p>il est "+time.gethours()+" : "+time.getminutes()+"</p>"); La variable «time» reçoit le résultat d une fonction incluse dans javascript, «new Date( )». Ceci permet de créer un objet informatique contenant la date et l heure. Pour récupérer les valeurs de cet objet, il faut lui demander. Par exemple, pour avoir les heures, nous lui demandons à travers une fonction «gethours( )» qu il nous les fournit. Comme souvent en informatique, les objets parlent anglais et il nous faut leur parler en anglais. Rechargez la page et observez le résultat. Attendez une minute, par exemple en lisant ces quelques phrases et à nouveau, rechargez la page et observez le résultat. Ainsi, la date et l heure s affichent sans que nous ayons à modifier le document. En fait, document est un objet informatique fourni par javascript, qui nous permet de manipuler la page web. Lorsque nous voulons ajouter, écrire une phrase dans le document, nous lui demandons par la fonction «document.write( )» en passant en paramètre ce que nous voulons écrire. Ceci marche très bien au chargement de la page (quand on ouvre la page ou quand on actualise la page). Revenons à nos circonférences de cercles. Affichez ceci dans une fenêtre «popup» était assez pénible, car d une part, il fallait cliquer plusieurs fois sur ok et d autre part le résultat n était plus accessible une fois la page chargée. Avec «document.write», nous allons pouvoir ajouter les résultats dans la page. Pour cela, recopiez le code javascript suivant dans l entête (entre les balises «<head>» et «</head>» : function circonference2(rayon) circ = 2*Math.PI*rayon; document.write("<p>la circonference du cercle de rayon "+rayon+"m est de "+circ+"m.</p>"); Et recopiez le code suivant dans le corps de la page, entre «<body>» et ««<h1>» : for(x = 0; x <= 5; x = x+0.5) circonference2(x); La fonction «circonference2» est une variante de la fonction précédente. Elle calcule la circonférence, mais au lieu de retourner le résultat, elle écrit un paragraphe dans le document. De fait, elle ne retourne aucune valeur. Ensuite, nous appelons cette fonction plusieurs fois, grâce à l instruction «pour (for) x variant». Rechargez votre page deuxiemepage.html et observez le résultat.
5 Nous venons de le voir, «document.write» permet d insérer dans la page, lors de son chargement, des éléments calculés. Cependant, cela ne permet pas une interaction plus conviviale une fois la page chargée. C est pourquoi nous allons utiliser la notion d événement. JAVASCRIPT ET LES EVENEMENTS UTILISATEURS Qu est-ce qu est un événement? C est une action réalisée par l utilisateur, la personne qui consulte la page web. Par exemple, nous pouvons vouloir déclencher une action, comme effectuer un calcul lorsque l utilisateur clique sur un bouton. Récupérer la page troisiemepage.html. Dans cette page, il y a un champ texte dans lequel on peut taper du texte, en particulier un rayon. Il y a aussi un bouton qui servira de déclencheur au calcul. Pour commencer, nous allons récupérer la valeur qui sera entrée dans le champ texte. Copiez le code javascript suivant dans l entête de la page (entre les balises «<head>» et «</head>») : function affichechampdetexte( ) champs = document.getelementbyid("rayon"); alert("la valeur entree est : "+champs.value); Pour récupérer la valeur entrée dans le champ texte, nous utilisons une fonction que l objet document nous fournit «document.getelementbyid». «id» est un attribut de chaque balise html qui permet de nommer une des balises de la page. Cet «id» doit être unique, de fait, il ne reste plus qu à demander au document quelle balise est nommée de telle ou telle façon pour l obtenir. Une autre possibilité pour manipuler cet élément html est d utiliser un sélecteur CSS via document.queryselector, par exemple «document.queryselector("#l id")». document.queryselector renvoit le premier élément html qui vérifie le sélecteur CSS. La fonction «affichechampdetexte» récupère donc la valeur entrée puis l affiche dans une fenêtre «popup». Les éléments html, manipulés via le javascript, sont des objets offrants différentes propriétés et méthodes, en fonction de leur nature (le «tag» qu ils représentent). Dans le cas d un «<input>», il y a l attribut value pour accéder à la valeur courante (ce qu a saisi l utilisateur). Il ne reste plus qu à déclencher l utilisation de cette fonction. Pour cela, nous allons utiliser un attribut particulier des balises html : «onclick» qui permet de déclencher une action lorsque l utilisateur clique «sur» la balise (le texte contenu dans la balise) «onmouseover» qui permet de déclencher une action lorsque l utilisateur fait passer la souris au dessus du texte contenu dans la balise «onmouseout» qui permet de déclencher une action lorsque l utilisateur enlève la souris d au dessus du texte contenu dans la balise.
6 Par exemple, nous allons ajouter ce code «html/javascript» onclick="affichechampdetexte();" dans la balise «<input type="button"». Rechargez votre page troisiemepage.html. Cliquez sur le bouton. Observez. Puis entrez un nombre dans le champ en haut de la page et recliquez sur le bouton. Finalement, tapez votre prénom dans le champ en haut de la page et recliquez sur le bouton. Nous le voyons, que nous ayons tapé du texte ou non, que nous ayons tapé un nombre ou non, nous récupérons la valeur (vide ou non) de manière identique. Heureusement, javascript nous fournit une fonction «isnan( )» (is Not a Number) qui permet de savoir si son paramètre n est pas un nombre ou si c est un nombre. Ainsi, nous pouvons tester si la valeur entrée dans le champ texte est un nombre ou non. Effacez tout le code javascript que vous insérer dans l entête de la page troisiemepage.html. Remplacezle par le code suivant : function affichechampdetexte( ) champs = document.getelementbyid("rayon"); if (isnan(champs.value)) alert("vous n'avez pas entre un nombre, je ne peux pas calculer la circonference!"); circonference = 2*Math.PI*champs.value ; alert("la circonference est : "+circonference+" m"); Rechargez votre page troisiemepage.html. Cliquez sur le bouton. Observez. Puis entrez un nombre dans le champ en haut de la page et recliquez sur le bouton. Finalement, tapez votre prénom dans le champ en haut de la page et recliquez sur le bouton. Cette fois, il n y a que lorsqu on ne tape rien dans le champ texte, c est-à-dire un texte vide soit «""» en javascript, que l on calcule pour rien. Comme il est possible de mettre des structures de contrôle («for», «if», etc.) dans des structures de contrôle, la solution consiste à utiliser un autre test avec l instruction «if». Remplacez la fonction «affichechamptexte» par cette nouvelle version (sur la page suivante): function affichechampdetexte( ) champs = document.getelementbyid("rayon"); if (isnan(champs.value)) alert("vous n'avez pas tape un nombre, je ne peux pas calculer la circonference!");
7 if (champs.value!= "") circonference = 2*Math.PI*champs.value; alert("la circonference du cercle de rayon "+champs.value+" m est de "+circonference+" m"); alert("vous n'avez rien tape, je ne peux pas calculer la circonference!"); Rechargez votre page troisiemepage.html. Cliquez sur le bouton. Observez. Puis entrez un nombre dans le champ en haut de la page et recliquez sur le bouton. Finalement, tapez votre prénom dans le champ en haut de la page et recliquez sur le bouton. Comme précédemment, affichez le résultat, ce n est déjà pas mal. Mais le résultat n est plus consultable alors nous pourrions vouloir utiliser «document.write». Seulement, cette fonction offerte par javascript (à travers l objet document) ne fonctionne «convenablement» qu au chargement de la page. Essayez par vous-même en remplaçant «alert» par «document.write». Rechargez votre page et essayez tout disparait sauf le résultat et on ne peut plus recalculer ou voir ce qu il y avait préalablement. Pour ajouter le résultat dans la page, il va falloir utiliser l attribut des objets informatiques (javascript) innerhtml, ce que nous voyons dans la section suivante. MODIFIER LA PAGE : L ATTRIBUT INNERHTML En effet, la propriété innerhtml des objets javascript représentant les balises html permet de manipuler le code html inclus dans ces balises. Téléchargez la page quatriemepage.html et obervez là dans votre navigateur ainsi que son code source. Vous y voyez une ligne, sur fond orange et encadrée de rouge, c est un paragraphe (balise «<p class="miseenvaleur">» et «</p>») qui est mis en forme avec du CSS. Nous allons essayer cette propriété innerhtml sur ce paragraphe. Dans cette balise paragraphe, ajoutez l appel à une fonction javascript : onclick="montrehtml(this);", c'est-à-dire après le «<p class="miseenvaleur"» et avant le «>», en laissant des espaces pour séparer les attributs. Le mot «this», ceci, permet de passer en paramètre le paragraphe lui-même, lorsqu on clique dessus car avec l attribut «onclick» qu on déclenche l appel. De plus rajoutez le code correspondant à la fonction «montrehtml» dans l entête de la page : function montrehtml(balise)
8 alert("le code html inclus dans la balise "+balise.tagname+" est <<"+balise.innerhtml+">>"); L attribut «balise.tagname» permet de connaitre la balise html représenté par l objet javascript. Rechargez votre page et cliquez sur le paragraphe sur fond orange. Modifiez le texte de ce paragraphe. Par exemple, ajoutez la phrase «Toutes les informations sur html sont sur la page <a href=" Rechargez et recliquez. Observez les évolutions. Cette fonction peut fonctionner avec n importe quelle balise. Ajoutez onclick="montrehtml(this);" sur la première balise paragraphe du corps de la page, c'est-à-dire après le «<p» et avant le «>» en laissant un espace entre le «p» et le «onclick». Rechargez et cliquez sur la première ligne de la page. Vous l avez constaté, «innerhtml» permet d avoir accès au code html inclus dans la balise. Il s agit en fait d une chaine de caractère. Et il est possible aussi de modifier ce code html. Par exemple, dans la fonction «montrehtml», ajoutez la ligne suivante : balise.innerhtml = balise.innerhtml + " on a vu le code html " ; Notez que nous utilisons ici la concaténation, c est-à-dire l ajout d un texte à la suite d un autre. Ainsi le code html présent avant le clic est conservé. Essayez à nouveau votre page et cliquez sur les différentes lignes de la page. Modifiez la ligne ci-dessus, par exemple en inversant de part et d autre du «+» les chaines de caractères «balise.innerhtml» et «" on a vu le code html "». Observez le résultat dans votre navigateur. Pour la suite, il est plus pratique de retire le «onclick» sur le premier paragraphe de la page. Pour en revenir à nos circonférences, au lieu de faire une fenêtre pour afficher le résultat avec la fonction «alert» nous allons ajouter le résultat dans un paragraphe prévu à cet effet. Dans la page web, il y a à la fin de la page, un paragraphe nommé (id) «resultats». Nous allons adapter la fonction «affichechampdetexte» (et en profiter pour lui changer de nom) avec notre nouvel outil «innerhtml». Dans l entête de la page quatriemepage.html, ajoutez ceci : function affichecirconference( ) endroitouecrire = document.getelementbyid("resultats"); champs = document.getelementbyid("rayon"); if (isnan(champs.value)) endroitouecrire.innerhtml = endroitouecrire.innerhtml + "vous n'avez pas tape un nombre, je ne peux pas calculer la circonference!<br />"; if (champs.value!= "") circonference = 2*Math.PI*champs.value endroitouecrire.innerhtml = endroitouecrire.innerhtml + "la circonference du cercle de rayon "+champs.value+" m est de "+circonference+" m.<br />";
9 endroitouecrire.innerhtml = endroitouecrire.innerhtml + "vous n'avez rien tape, je ne peux pas calculer la circonference!<br />"; Rechargez la page. Le calcul ne se fait pas? n avez-vous rien oublié? par exemple le déclenchement du calcul quand on clique sur le bouton? (le code «onclick="affichecirconference( );"»). Modifiez le code de la fonction «affichecirconference» pour ne pas avoir de message d erreur (quand on n a pas tapé un nombre) dans la page. Par exemple en utilisant la fonction «alert» au lieu de modifier le code html Voilà, nous avons obtenu une page dont le contenu évolue en fonction des actions de l utilisateur. Vous venez de manipuler dynamiquement une page web.
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012 FORMULAIRE DE CONTACT POUR PORTFOLIO PRINCIPE GENERAL Nous souhaitons réaliser un formulaire de contact comprenant les champs suivants : NOM PRENOM ADRESSE MAIL MESSAGE
Utilisation de l éditeur.
Utilisation de l éditeur. Préambule...2 Configuration du navigateur...3 Débloquez les pop-up...5 Mise en évidence du texte...6 Mise en évidence du texte...6 Mise en page du texte...7 Utilisation de tableaux....7
Document Object Model (DOM)
Document Object Model (DOM) Jean-Claude Charr Maître de conférences IUT de Belfort Montbéliard Université de Franche Comté Description générale Définit un standard pour accéder aux documents structurés
GOOGLE ANALYTICS. Ajout du code de suivi sur PowerBoutique. Ajout du code de suivi Google Analytics. Page 1 / 7 TUTO / GOOGLE ANALYTICS
Ajout du code de suivi Google Analytics Page 1 / 7 I. Création du compte sur Google Analytics 1. Connectez-vous à www.google.fr 2. Entrez «Google Analytics» dans la barre de recherche. 3. Cliquez sur le
TD3 - Facturation avec archivage automatisé
TD3 - Facturation avec archivage automatisé Objectifs Insérer les formules nécessaires aux calculs d une facture. Créer une macro- commande avec l enregistreur de macros et l affecter à un bouton. Utiliser
Manuel d utilisation de la messagerie. http://zimbra.enpc.fr
Manuel d utilisation de la messagerie http://zimbra.enpc.fr ÉCOLE DES PONTS PARISTECH/ DSI JANVIER 04 SOMMAIRE. Connexion à la messagerie.... Présentation générale de l écran d accueil.... Déconnexion...
Tous les autres noms de produits ou appellations sont des marques déposées ou des noms commerciaux appartenant à leurs propriétaires respectifs.
Connexion à 4D Server depuis une page ASP Par Noreddine MARGOUM, Technicien Contrôle Qualité, 4D S.A. Note technique 4D-200403-08-FR Version 1 Date 1 Mars 2004 Résumé Le propos de cette note technique
Publication dans le Back Office
Site Web de l association des ingénieurs INSA de Lyon Publication dans le Back Office Note : dans ce guide, l'appellation GI signifie Groupe d'intérêt, et GR Groupe Régional laure Buisset Page 1 17/09/2008
Optimiser pour les appareils mobiles
chapitre 6 Optimiser pour les appareils mobiles 6.1 Créer un site adapté aux terminaux mobiles avec jquery Mobile... 217 6.2 Transformer son site mobile en application native grâce à PhoneGap:Build...
Description des pratiques à adopter pour la mise à jour du layout en utilisant le gestionnaire de conception de Sharepoint 2013
Exemple d utilisation du gestionnaire de conception Description des pratiques à adopter pour la mise à jour du layout en utilisant le gestionnaire de conception de Sharepoint 2013 6, rue de l Etang, L-5326
HTML. Notions générales
1 HTML Le langage HTML est le langage de base permettant de construire des pages web, que celles-ci soient destinées à être affichées sur un iphone/android ou non. Dans notre cas, HTML sera associé à CSS
Optimiser moteur recherche
Optimiser moteur recherche Vous apprennez à inscrire vos sites dans les moteurs de recherche et les optimiser, déjà à la construction Worldsoft SA Inscription de sites Web dans les moteurs de recherche
NFA016 : Introduction. Pour naviguer sur le Web, il faut : Naviguer: dialoguer avec un serveur web
NFA016 : Introduction O. Pons, S. Rosmorduc Conservatoire National des Arts & Métiers Pour naviguer sur le Web, il faut : 1. Une connexion au réseau Réseau Connexion physique (câbles,sans fils, ) à des
< Atelier 1 /> Démarrer une application web
MES ANNOTATIONS SONT EN ROUGE : Axel < Atelier 1 /> Démarrer une application web Microsoft France Tutorial Découverte de ASP.NET 2.0 Sommaire 1 INTRODUCTION... 3 1.1 CONTEXTE FONCTIONNEL... 3 1.2 CONTEXTE
Simple, facile à archiver, il est disponible dès le premier jour du mois * et n utilise ni papier ni enveloppe. Le e-relevé / Mode d emploi
Le e-relevé / Simple, facile à archiver, il est disponible dès le premier jour du mois * et n utilise ni papier ni enveloppe. Chacun de vous mérite une attention unique * Premier jour ouvré du mois. Qu
Afin d accéder à votre messagerie personnelle, vous devez vous identifier par votre adresse mail et votre mot de passe :
1 CONNEXION A LA MESSAGERIE ZIMBRA PAR LE WEBMAIL Ecran de connexion à la messagerie Rendez vous dans un premier temps sur la page correspondant à votre espace webmail : http://webmailn.%votrenomdedomaine%
WebSMS. Avril 2009. WebSMS Orange Mali - Guide utilisateur
WebSMS Guide utilisateur Avril 2009 Sommaire 1. Présentation du service WebSMS 2. Connexion au compte WebSMS 3. Envoyer un message 4. Carnet d adresses 5. Messages envoyés 6. Archives 7. Statistiques 8.
Serveur d'application Client HTML/JS. Apache Thrift Bootcamp
Serveur d'application Client HTML/JS Apache Thrift Bootcamp Pré-requis La liste ci-dessous de logiciels doit être installée et opérationnelle sur la machine des participants : Compilateur thrift http://thrift.apache.org/
Flex. Lire les données de manière contrôlée. Programmation Flex 4 Aurélien VANNIEUWENHUYZE
Flex Lire les données de manière contrôlée 1 Plan Lier les données Stocker les données Valider les données 2 Gérer des données Lier des données La notion de DataBinding est l une des plus importantes du
MO-Call pour les Ordinateurs. Guide de l utilisateur
MO-Call pour les Ordinateurs Guide de l utilisateur Sommaire MO-CALL POUR ORDINATEURS...1 GUIDE DE L UTILISATEUR...1 SOMMAIRE...2 BIENVENUE CHEZ MO-CALL...4 MISE EN ROUTE...5 CONNEXION...5 APPELS...7 COMPOSITION
INTRODUCTION A JAVA. Fichier en langage machine Exécutable
INTRODUCTION A JAVA JAVA est un langage orienté-objet pur. Il ressemble beaucoup à C++ au niveau de la syntaxe. En revanche, ces deux langages sont très différents dans leur structure (organisation du
Crédit Agricole en ligne
Crédit Agricole en ligne Internet Explorer 7 & 8 Vérifier le paramétrage de son navigateur Internet Vérifier la version de son navigateur Internet... 2 Autoriser l accès aux pages sécurisées... 4 Vider
ENVOI EN NOMBRE DE Mails PERSONNALISES
ENVOI EN NOMBRE DE Mails PERSONNALISES 2 Téléchargement 3 Installation 6 Ecran d accueil 15 L envoi de mails 22 Envoi d un document HTML crée avec Word (envoi en base 64) 25 Le compte courriel 27 L historique
MAILING KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4
MAILING Table des matières KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4 INSERER UNE IMAGE (OU UNE PHOTO) PAS DE COPIER / COLLER... 5 INSERER UN TABLEAU...
Séance d ED n 5 : HTML et JavaScript
Séance d ED n 5 : HTML et JavaScript EXERCICE 1 1) le but de cet exercice est de construire l'interface suivante en html: une réponse : 1)
Espace pro. Installation des composants avec Firefox. Pour. Windows XP Vista en 32 et 64 bits Windows 7 en 32 et 64 bits
Espace pro Installation des composants avec Firefox Pour Windows XP Vista en 32 et 64 bits Windows 7 en 32 et 64 bits Version 2.0.3 1 Sommaire 1. Installation du composant de lecture de la carte Vitale
PARTAGER UN ANNUAIRE COLLECTIF DE SIGNETS AVEC DEL.ICIO.US
PARTAGER UN ANNUAIRE COLLECTIF DE SIGNETS AVEC DEL.ICIO.US Introduction Pourquoi utiliser DEL.ICIO.US? Cet outil permet à plusieurs personnes de partager la même liste de sites favoris et ce sur n importe
les Formulaires / Sous-Formulaires Présentation...2 1. Créer un formulaire à partir d une table...3
Présentation...2 1. Créer un formulaire à partir d une table...3 2. Les contrôles :...10 2.1 Le contrôle "Intitulé"...11 2.2 Le contrôle "Zone de Texte"...12 2.3 Le contrôle «Groupe d options»...14 2.4
KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.
KompoZer Créer un site «simple» Composition du site : _ une page d'accueil : index.html _ une page pour la théorie : theorie.html _ une page pour les photos : photos.html _ une page avec la galerie : galerie.html
P E U G E O T A L E R T Z O N E S Y S T E M E D E N A V I GAT I O N S U R T A B L E T T E T A C T I L E
PEUGEOT ALERT ZONE NOTICE SYSTEME DE NAVIGATION SUR ECRAN TACTILE Ce document décrit la procédure d achat, de téléchargement et d installation de mises à jour cartographiques et des bases de données Peugeot
ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A.
ContactForm et ContactFormLight - Gestionnaires de formulaire pour Prestashop Edité par ARETMIC S.A. - 1 - PREAMBULE Les conditions générales d utilisation détaillant l ensemble des dispositions applicables
SOMMAIRE. 1. Connexion à la messagerie Zimbra 4 1.1.Pré-requis 4 1.2.Ecran de connexion à la messagerie 4
Messagerie Zimbra version 7 Prise en main Nadège HARDY-VIDAL 2 septembre 20 SOMMAIRE. Connexion à la messagerie Zimbra 4..Pré-requis 4.2.Ecran de connexion à la messagerie 4 2. Présentation générale de
Consignes générales :
PROCÉDURE POUR DÉPÔT DANS WEBCT Consignes générales : 1) Il est important de toujours conserver une copie de votre Webfolio ou Dossier professionnel sur votre disquette, clé USB ou sur votre disque dur
Création d'un questionnaire (sondage)
Création d'un questionnaire (sondage) Le but de ce petit tuto est d'avoir les séquences pas à pas pour la création d'un questionnaire de façon à ne pas devoir rechercher la manière de procéder si l'outil
Guide d utilisation 2012
Guide d utilisation 2012 Tout ce dont vous avez besoin pour bien démarrer REACOM La performance marketing SOMMAIRE Démarrez avec reagiciel Accédez à votre console d administration 4 Gestion internet Aperçu
Tutoriel Atout Facture. 14/01/2015 Codelpi
Tutoriel Atout Facture 14/01/2015 Codelpi Sommaire Le menu... 3 Menu gauche... 3 Menu haut-droit... 4 Tableau de bord... 5 Les clients... 8 Créer un client... 8 Modifier un client... 9 Ses adresses...
Guide d installation CLX.PayMaker Office (3PC)
Guide d installation CLX.PayMaker Office (3PC) Sommaire 1. Installation et reprise des données... 2 2. Premiers pas établir une connexion au compte bancaire et recevoir des informations de compte... 4
GUIDE Excel (version débutante) Version 2013
Table des matières GUIDE Excel (version débutante) Version 2013 1. Créer un nouveau document Excel... 3 2. Modifier un document Excel... 3 3. La fenêtre Excel... 4 4. Les rubans... 4 5. Saisir du texte
Tutoriel : Créer un site web simple avec Composer. Fiche consigne Page 1 sur 6
1 Lancement du logiciel Composer Fiche consigne Page 1 sur 6 Cliquer sur l icône du bureau représenté en en-tête du présent document ou cherche le logiciel «Composer» dans le menu des programmes. 2 Création
Modes Opératoires WinTrans Mai 13 ~ 1 ~
Modes Opératoires WinTrans Mai 13 ~ 1 ~ Table des matières Facturation... 2 Tri Filtre... 2 Procédures facturation... 3 Transfert Compta... 8 Création d un profil utilisateur... Erreur! Signet non défini.
Les sites Internet dynamiques. contact : Patrick VINCENT pvincent@erasme.org
Les sites Internet dynamiques contact : Patrick VINCENT pvincent@erasme.org Qu est-ce qu un site Web? ensemble de pages multimédia (texte, images, son, vidéo, ) organisées autour d une page d accueil et
Styler un document sous OpenOffice 4.0
Mars 2014 Styler un document sous OpenOffice 4.0 Un style est un ensemble de caractéristiques de mise en forme (police, taille, espacement, etc.) qui sert à structurer un document en l organisant de manière
Création d un site Internet
Création d un site Internet Weebly.com Johanne Raymond Collège Lionel Groulx, mai 2010 Service du soutien à l enseignement et Plan de réussite Ouvrir un compte sur Weebly... 1 Modifier le modèle... 2 Ajouter
Gestion des documents avec ALFRESCO
Gestion des documents avec ALFRESCO 1 INTRODUCTION : 2 1.1 A quoi sert ALFRESCO? 2 1.2 Comment s en servir? 2 2 Créer d un site collaboratif 3 2.1 Créer le site 3 2.2 Inviter des membres 4 3 Accéder à
MANUEL DE L UTILISATEUR
MANUEL DE L UTILISATEUR COMPAS DYNAMIQUE Page 1 / 81 Page 2 / 81 SOMMAIRE PREAMBULE... 7 CHAPITRE 1 :... 9 PRESENTATION DU COMPAS DYNAMIQUE... 9 1 INTRODUCTION... 11 1.1 QU EST-CE QUE LE COMPAS DYNAMIQUE?...
Créer sa première base de données Access Partie 3/4 - Création d un formulaire
- le 12/02/2013 Créer sa première base de données Access Partie 3/4 - Création d un formulaire Ce tutoriel est la suite de l article sur la création d une table et l article sur la création d une requête.
Date M.P Libellé Catégorie S.Catégorie Crédit Débit Solde S.B
Excel : Réalisation d un classeur Compta Saisir les étiquettes Renommer la première feuille Compta Laisser la première ligne vide et sur la deuxième ligne saisir les étiquettes Se placer sur A2 et saisir
Sélection du contrôleur
Démo CoDeSys - 1 - 1. Configuration de l environnement de travail : Lancer le logiciel CoDeSys Fichier Nouveau Lors de la première utilisation, une boîte de dialogue apparaît permettant la sélection du
Thunderbird est facilement téléchargeable depuis le site officiel
0BThunderbird : une messagerie de bureau simple et gratuite! Thunderbird est un logiciel de messagerie résident dans votre système, spécialisé dans la gestion des courriers électroniques. Thunderbird n
AIDE ENTREPRISE SIS-ePP Plateforme de dématérialisation des marchés publics
AIDE ENTREPRISE SIS-ePP Plateforme de dématérialisation des marchés publics Ce manuel d'utilisation est destiné à guider les opérateurs économiques durant la phase de consultation jusqu'au dépôt des offres
Édu-groupe - Version 4.3
Édu-groupe - Version 4.3 Guide de l utilisateur Gestion des fichiers Société GRICS, Équipe Évaluation Août 2012 2 CONSIDÉRATIONS GÉNÉRALES A. Importante mise en garde concernant les types de fureteur Les
Services bancaires par Internet aux entreprises. Guide pratique pour : Rapports de solde Version 8.05.22
Services bancaires par Internet aux entreprises Guide pratique pour : Rapports de solde Version 8.05.22 Table des matières Avez-vous besoin d aide?... 3 Exigences informatiques... 4 Navigateurs acceptés...
Manuel d utilisation du web mail Zimbra 7.1
Manuel d utilisation du web mail Zimbra 7.1 ma solution de communication intelligente Sommaire 1 Connexion à la messagerie Zimbra p.4 1.1 Prérequis p.4 1.1.1 Ecran de connexion à la messagerie p.4 2 Presentation
TUTORIEL Qualit Eval. Introduction :
TUTORIEL Qualit Eval Introduction : Qualit Eval est à la fois un logiciel et un référentiel d évaluation de la qualité des prestations en établissements pour Personnes Agées. Notre outil a été spécifiquement
EXCEL TUTORIEL 2012/2013
EXCEL TUTORIEL 2012/2013 Excel est un tableur, c est-à-dire un logiciel de gestion de tableaux. Il permet de réaliser des calculs avec des valeurs numériques, mais aussi avec des dates et des textes. Ainsi
Tapez le titre de la page «BASTIA ville méditerranéenne», puis allez deux fois à la ligne à l aide de la touche Entrée.
Créer un site Internet à l aide du logiciel NVU Le logiciel NVU, permet l édition Wysiwyg (What You See, Is What You Get, ce que vous voyez, est ce que vous obtenez ) d un site internet. Vous rédigez le
EXTENSION WORDPRESS. Contact Form 7. Proposé par :
Contact Form 7 Proposé par : Sommaire Sommaire... 2 Présentation... 3 I. Le Tutoriel... 3 1) Espace de travail... 3 2) Téléchargez les extensions nécessaires... 3 3) Configuration du Formulaire... 7 1)
Utiliser le site Voyages-sncf.com
voyages-sncf.com 17 mars 2014 p 1 Utiliser le site Voyages-sncf.com Avec ce tutoriel, vous apprendrez à utiliser le site de la SNCF dédié aux trajets grandes lignes et plus particulièrement à : rechercher
Guide d utilisation de la clé mémoire USB
Service des bibliothèques Guide d utilisation de la clé mémoire USB I- Préambule Politique de prêt : Le Service des bibliothèques vous permet de faire l emprunt d une clé mémoire pour une période de 48
Les Différents types de Requêtes dans Access
Les Différents types de Requêtes dans Access Il existe six types de requêtes. Les Requêtes «Sélection», qui sont le mode par défaut et correspondent à des «vues» des tables originelles. Cela signifie que
Guide du maître MODULE TICE. Recherche sur Internet. Mise en forme d exposé et insertion d image. Envoi de fichiers joints
Guide du maître MODULE TICE Recherche sur Internet Mise en forme d exposé et insertion d image Envoi de fichiers joints Auteurs : Sylvain TAUSSAC et Vincent ROUVELET, Académie de Montpellier en collaboration
REUNION INFORMATIQUE 15/09/12 Utilisation Messagerie «Webmail 2» I ) Préambule : Pourquoi l utilisation d une messagerie commune?
REUNION INFORMATIQUE 15/09/12 Utilisation Messagerie «Webmail 2» I ) Préambule : Pourquoi l utilisation d une messagerie commune? Voilà plus d une dizaine d année, lorsque j avais émis le souhait de travailler
AGASC / BUREAU INFORMATION JEUNESSE 06700 Saint Laurent du Var - E mail : bij@agasc.fr / Tel : 04.93.07.00.66 CONSIGNE N 1 :
CONSIGNE N 1 : Rédiger puis envoyer un nouveau message La fenêtre de la boîte de messagerie s affiche Cliquer sur «Ecrire» ou «Nouveau message» pour ouvrir cette nouvelle fenêtre. Ensuite, suivre cette
Module Com231A - Web et Bases de Données Notion 5 : Formulaires et utilisation des Bases de Données avec PHP
Module Com231A - Web et Bases de Données Notion 5 : Formulaires et utilisation des Bases de Données avec PHP Au cours de ce TP, vous allez voir comment PHP permet aux utilisateurs, une interaction avec
Installation et configuration du serveur syslog sur Synology DSM 4.0
Installation et configuration du serveur syslog sur Synology DSM 4.0 Préambule Avoir un NAS équipé avec la version 4.0 ou ultérieure du DSM de Synology. Installation Pour installer le paquet Syslog Server,
SRAL Saint Raphaël. Maison des associations 213, rue de la Soleillette 83700 Saint Raphaël. : 06 26 56 41 85 - : dromain.jean-pierre@neuf.
SRAL Saint Raphaël Maison des associations 213, rue de la Soleillette 83700 Saint Raphaël : 06 26 56 41 85 - : dromain.jean-pierre@neuf.fr Document réalisé par Jean Pierre DROMAIN Pour servir de support
CARPE. Documentation Informatique S E T R A. Version 2.00. Août 2013. CARPE (Documentation Informatique) 1
CARPE (Documentation Informatique) 1 CARPE Version 2.00 Août 2013 Documentation Informatique S E T R A Programme CARPE - Manuel informatique de l'utilisateur CARPE (Documentation Informatique) 2 Table
Sauvegarder et restaurer les données PMB
Fiche technique PMB n 2.9 Sauvegarder et restaurer les données PMB Objectif : Savoir sauvegarder les paramètres, les notices, les exemplaires, les prêts... avec PMB Notez bien : Le documentaliste est responsable
Groupe Eyrolles, 2006, pour la présente édition, ISBN : 2-212-11782-5
Groupe Eyrolles, 2006, pour la présente édition, ISBN : 2-212-11782-5 Table des matières Chapitre A : Principes de base des scripts... 1 Élaboration de votre premier script... 1 Importance du modèle...
Guide de l utilisateur Communauté virtuelle de pratique en gestion intégrée des risques
Guide de l utilisateur Communauté virtuelle de pratique en gestion intégrée des risques Mars 2012 Table des matières Introduction... 2 Prérequis... 3 Connexion à Alfresco... 3 Authentification... 3 Déconnexion...
The Grid 2: Manuel d utilisation
The Grid 2: Manuel d utilisation Bienvenue dans The Grid 2 Merci d avoir choisi The Grid 2! Ce guide va vous apprendre tout ce que vous devez savoir à propos de The Grid 2. Il vous guidera pas à pas pour
Votre site Internet avec FrontPage Express en 1 heure chrono
1.1. Précautions préliminaires Votre site Internet avec FrontPage Express en 1 heure chrono Le contenu de ce site n'est pas très élaboré mais il est conçu uniquement dans un but pédagogique. Pour débuter,
Paramétrage des navigateurs
Paramétrage des navigateurs 1 Procédure d'accès aux ressources électroniques nationales suivant le script de configuration automatique de proxy revelec.pac Document mis à jour en avril 201 Configuration
Création WEB avec DreamweaverMX
Creation Web avec DreamweaverMX MX Initiation Sommaire.preparation.mise en forme.liens hypertextes.images.liens sur images.images avec zones sensibles.images survolees.liens de type courriel.apercu dans
KWISATZ_TUTO_module_magento novembre 2012 KWISATZ MODULE MAGENTO
_TUTO_module_magento Table des matières -1) - :...2-1.1) Introduction :...2-1.2) Description :...3-1.2.1) Schéma :...3-1.3) Mise en place :...4-1.3.1) MAGENTO :...4-1.3.1.1) Les Web Services :...4-1.3.1.2)
Gestion de contenu d un site web avec TYPO3 Manuel de l administrateur
Gestion de contenu d un site web avec TYPO3 Manuel de l administrateur 1. Présentation de Typo3... 2 2. Rôle de l administrateur... 2 3. Configuration du site Web... 3 3.0 Que faire si les changements
Tutoriel BLOGGER. Pour vous donner une idée, voici un exemple de blog : http://formationlaragne.blogspot.fr/
Tutoriel BLOGGER Blogger est un outil Google gratuit de publication de blogs qui permet de partager du texte, des photos et des vidéos. C est un outil simple, bénéficiant du référencement de Google, ce
Prospective 2011. Manuel D utilisation. Logiciel édité par la société
Prospective 2011 Manuel D utilisation Logiciel édité par la société I. PREAMBULE II. III. IV. a) Avant propos... 3 b) Support... 3 INSTALLATION ET LICENCE a) Achat du logiciel... 4 b) Installation du logiciel...
Atelier E-TOURISME 2013. Optimiser la visibilité de son site sur les moteurs de recherche. ecotourismepro.jimdo.com
Atelier E-TOURISME 2013 Optimiser la visibilité de son site sur les moteurs de recherche ecotourismepro.jimdo.com Optimiser la visibilité de son site sur les moteurs de recherche Audrey Piquemal Chargée
Sommaire. 2. L accès aux modules. 1. Aspects techniques. 1.1 Le matériel requis 2
Manuel Etudiant Modules de formation à distance en comptabilité Sommaire 1. Aspects techniques 1.1 Le matériel requis 2 2. L accès aux modules 2.1 L accès aux modules lors d une première entrée 2 2.2 Difficultés
Avant-propos Certificats et provisioning profiles
Avant-propos Certificats et provisioning profiles Devenir «développeur Apple» ne signifie pas uniquement que vous allez pouvoir développer des apps, vous allez également avoir certaines responsabilités
Création d'un site dynamique en PHP avec Dreamweaver et MySQL
Création d'un site dynamique en PHP avec Dreamweaver et MySQL 1. Création et configuration du site 1.1. Configuration de Dreamweaver Avant de commencer, il est nécessaire de connaître l'emplacement du
TUTORIEL IMPRESS. Ouvrir Impress cocher «présentation vierge», «suivant» cocher «écran», «suivant» cocher «standard», «créer»
TUTORIEL IMPRESS Ouvrir Impress cocher «présentation vierge», «suivant» cocher «écran», «suivant» cocher «standard», «créer» Une page impress s'ouvre : Le volet gauche contiendra toutes les diapositives
PAGE 1. L écran du logiciel d Open Office Draw. Barre de menu: Les commandes du logiciel
PAGE L écran du logiciel d Open Office Draw Nom du document : Nom d enregistrement Barre de mise forme: Ligne, couleurs, fond,... Barre de menu: Les commandes du logiciel Barre d outils: Les boutons de
Notice de fonctionnement DVR H264. + Méthode de Visionnage ESEENET
Notice de fonctionnement DVR H264 + Méthode de Visionnage ESEENET 1 Le point de départ de chacune des différentes configurations traitées ci-dessous sera l écran de visualisation des 4 ou 8 caméras. A
Comment déposer les comptes annuels des associations, fondations et fonds de dotation.
Comment déposer les comptes annuels des associations, fondations et fonds de dotation. Quels sont les organismes qui doivent déposer? Les associations et les fondations lorsque le montant des dons et/ou
1 è r e étape : créer sa base de d o n n é e s
Le publipostage (ou mailing) permet à un document (le document principal créé avec Open Office Writer) de profiter des informations se trouvant dans un autre document (la source de données créée avec Open
COURS WINDEV NUMERO 3
COURS WINDEV NUMERO 3 01/02/2015 Travailler avec un fichier de données Etude du gestionnaire d analyse, Manipulation des tables mémoires, Manipulation de données, Création d états, Pré requis : Cours WinDev
La Clé informatique. Formation Excel XP Aide-mémoire
La Clé informatique Formation Excel XP Aide-mémoire Septembre 2005 Table des matières Qu est-ce que le logiciel Microsoft Excel?... 3 Classeur... 4 Cellule... 5 Barre d outil dans Excel...6 Fonctions habituelles
Utilisation de Sarbacane 3 Sarbacane Software
Tutorial par Anthony Da Cruz Utilisation de Sarbacane 3 Sarbacane Software Ambiance Soleil 17 Rue Royale 74000, Annecy Sommaire 1. Présentation générale 2. Guide étape par étape 3. Astuces de l éditeur
espace de partage Explication rapide
GUIDE RAPIDE UTILISATEUR espace de partage Explication rapide Les experts de la «Compagnie des experts architectes près la Cour d appel de Paris» se sont regroupés sur un même portail, pour que tous les
Rapports d activités et financiers par Internet. Manuel Utilisateur
Rapports d activités et financiers par Internet Manuel Utilisateur Table des matières 1. Introduction... 3 2. Pré requis... 3 3. Principe de fonctionnement... 3 4. Connexion au site Internet... 4 5. Remplir
Inscription de votre site sur Google Configuration du sitemap et de Webmaster Tools pour PrestaBox
Tutoriel PrestaBox n 3 Catégorie : Référencement Inscription de votre site sur Google Configuration du sitemap et de Webmaster Tools pour PrestaBox Pour vous aider dans la mise en place et la gestion de
Tutoriel Prise en Main de la Plateforme MetaTrader 4. Mise à jour : 7/09/2009 1.6
Tutoriel Prise en Main de la Plateforme MetaTrader 4 Mise à jour : 7/09/2009 1.6 Ce tutoriel de prise en main permet d utiliser les principales fonctionnalités de MetaTrader. La plateforme MetaTrader utilise
Récupération de données perdues
Récupération de données perdues Bienvenue dans ce cours tutoriel concernant la récupération de données supprimées. Vous avez supprimé involontairement les fichiers de la corbeille auxquels vous teniez?
Base est le module pour les bases
Base Votre première base de données avec Base Guy Veyssière Base est le module pour les bases de données, de la suite OpenOffice. org. Ce n est pas le module le plus abouti mais il est performant et si
Manuel utilisateur Netviewer one2one
Manuel utilisateur Netviewer one2one INDEX 1. Etablissement de la connexion...2 1.1. Client... 2 2. Travailler avec Netviewer en mode Show...3 2.1. Vue écran... 3 2.2. Le panneau Netviewer... 3 2.3. Caractéristiques...
Nouveautés de la version moodle 2.7
Nouveautés de la version moodle 2.7 Atto Éditeur de texte facile Le nouveau éditeur de texte dans Moodle à été développé spécialement pour convivialité et accessibilité. Au-dessus de la zone d'écriture
Guide d utilisation des services My Office
Guide d utilisation des services My Office Note importante : La version de ce guide d utilisation ne s applique qu à l interface RIA (Web 2.0) de My Office. Une section supplémentaire concernant l interface