Création de pages Web dynamiques et sympathiques.

Slides:



Advertisements
Présentations similaires
La création de pages web Lorsqu'on « navigue » sur l'Internet, les pages que nous visitons sont encore pour beaucoup en HTML. Comment fait-on pour les.
Advertisements

Lien hypertexte ou html
1 JavaScript V0 : Nauer. 2 JavaScript Quid ? Langage de programmation lié à HTML. Code JavaScript intégré aux pages HTML. Code interprété par le navigateur.
Conception de Site Webs Interactifs Cours 4
TOUQUET Arnaud ▪ GI05 BLONDEEL Igor ▪ GM05
HTML5, CSS3, PHP5, Javascript, AJAX
Copyright France Télécom, tous droits réservés Paris Web Ateliers Les bibliothèques JS jQuery Orange Labs Julien Wajsberg, Recherche & Développement.
Utilisation de l’outil Firebug
V 1.5 Site Web de Formation. Intérêts Cette fonctionnalité de Spiral vous permet de créer et gérer des sites web entièrement personnalisable venant s'appuyer.
Quest-ce quun lien ?. Exemple à partir du site du ministère de léducation nationale A la page daccueil, vous y trouvez du texte et … des liens vers dautres.
12 novembre 2012 Grégory Petit
Introduction aux Web Services Partie 1. Technologies HTML-XML
2006/2007Denis Cabasson – Programmation Web Cours de programmation web ENSAE
JQuery.
Javascript les spécificités du langage - Partie 6 -
Faculté I&C, Claude Petitpierre, André Maurer What is this ? (Quest ce que this ?)
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
Découverte de la feuille de style. CSS Cascading Style Sheets Il ne s'agit pas ici de faire un cours de code CSS ! Il faudrait un certain nombre de chapitres.
 Ecriture dynamique des Calques, des tableaux HTML
Le langage Javascript pour le web et application au DHTML
Manipulation de formulaires en Javascript
1. 2 PLAN DE LA PRÉSENTATION - SECTION 1 : Code HTML - SECTION 2.1. : CSS (Méthode 1) - SECTION 2.2. : CSS (Méthode 2) - SECTION 3 : JavaScript - SECTION.
Initialisation des sites web Étapes importantes. La conversion de vos comptes Web nest pas terminée (après discussion avec les techniciens voici comment.
Créer son propre BLOG/Site web pédagogique
BLOGS (carnets web, cybercarnets) Didactiques des NTICS.
Hot Potatoes
Jquery.
Cours de programmation web
Module: Technologie web 2.0 Classe: 3ème année ESPRIT
L’ ACCESSIBILITE « C’est mettre le Web et ses services à la disposition de tous les individus, quels que soient leur matériel ou logiciel, leur infrastructure.
Les balises HTML et les objets JavaScript correspondants Objet document L'objet document est important dans la mesure ou il contient tous les objets du.
 Objet window, la fenêtre du navigateur
3. Personnaliser une page web Visualiser les liens entre feuille de style et html grâce à l’inspecteur d’éléments Savoir si les modifications doivent être.
Concevoir un site web de A a Z Cours 3. Aujourd’hui Découper sa page en tranche pour une intégration graphique optimale avec Photoshop L’intégration des.
S'initier au HTML et aux feuilles de style CSS Cours 5.
420-B63 Programmation Web Avancée Auteur : Frédéric Thériault 1.
HTML Cours 3. Plan du cours Les feuilles de styles CSS Mise en forme du texte et des paragraphes.
S'initier au HTML et aux feuilles de style CSS Cours 5.
CSS et DREAMWEAVER.
Le JavaScript.. Histoire Langage créé en 1995 par Brendan Eich pour la Netscape Communications Corporation. Est inspiré de nombreux langages, notamment.
24 octobre 2012 Grégory Petit
Séminaire de rentrée cours de programmation web & Wordpress
M2202 – Algorithmique – T.BAUSER. Objectifs Utiliser Jquery pour : - modifier/ajouter/supprimer un élément/un attribut/une classe, - créer des animations,
Language html & CSS “Examen”. Un exemple La quelle de ces balises n’est pas une balise obligatoire?
Scénario Les scénarios permettent de modifier la position, taille … des calques au cours du temps. Son fonctionnement est très proche de celui de Macromedia.
Dreamweaver Séance 1.
1 Présentation de DREAMWEAVER (1) Gaël TREMEAU GI05 Printemps 2006.
Présentation de Dreamveawer
Dreamweaver MX Jauneau Marie Claude-Antoine Zarate.
Guillaume MICHAUD – Yvan LECOMTE
Présentation Dreamweaver – Partie 2 Mickaël PIQUE – Automne 2004.
SI28 - Écriture multimédia interactive – A2004 Présentation Dreamweaver Partie 2 Pierre Malet GSU05.
Flash MX – Séance 2 Interactions & ActionScript David Rapin Si28 P06.
Dreamweaver le retour Avec Les Formulaires Les Calques
Plan de la présentation Le langage HTML Dreamweaver MX Les premiers outils pour créer une page web :  Propriétés d’une page  Création de cadres  Création.
Dreamweaver (2) ● les calques (layers) ● les comportements
FORMULAIRES FOMULAIRE Permet à l’utilisateur d’entrer des renseignements le concernant. Utilisation –Inscription sur un site –Mise à jour d’une base.
Les formulaires Les calques Les comportements Les scénarios Les modèles Les feuilles de styles (CSS) La mise en ligne Les formulaires permettent à l’utilisateur.
SI28 - Écriture interactive et multimédia Laurent FETZER GSU04, Lucie SOLA GSU06 P PRESENTATION Dreamweaver 2.
SI28 – Ecriture interactive et multimédia Sylvain Slaton – Pierre Laporte.
Introduction au HTML Qu’est ce que le HTML ?
Dreamweaver 2 Feuilles de Style CSS Formulaires Calques Comportements
Les calques Les Template (modèles) Les Comportements Les scénarios Les formulaires Les CSS Le serveur Web de l’UTC Présentation.
SI28 : Ecriture interactive et multimédia
DREAMWEAVER SÉANCE 2 SI28 Jonathan Barone – Thomas Lulé.
1 er séance SI28 A2004 YIN Lei Emmanuel Eugene. Plan de l’exposé  Introduction au HTML  Le HTML dans le bloc-notes (notepad)  Présentation de Dreamweaver.
TP ISN-Terminale S Notion de code HTML. I) Visualisation du code source d’une page web Se mettre sur une page web quelconque : clic droit, Afficher la.
INITIATION A LA CREATION D’UNE PAGE WEB C-X. PROSPERINI A : COMMUNICATION ET SYNDICATS Afrique Francophone 20/04/2010.
CSS et DREAMWEAVER (Suite et fin)  Les liens
Transcription de la présentation:

Création de pages Web dynamiques et sympathiques

JQuery permet d'améliorer à moindres frais vos pages Web et autres blogs. Télécharger la dernière version de JQuery sur

Squelette d'une page XHTML dans laquelle du code JQuery va être inséré //Emplacement du code JavaScript qui invoque JQuery

Avant tout, tester que le document est bien chargé avec la fonction JQuery ready() appliquée à l'objet document $(document).ready(function() { alert('Le document est prêt à être manipulé');} );

Capturer un événement clic sur un lien et le détourner $(document).ready(function(){ $("a").click(function(){ alert("Vous avez cliqué sur le lien '"+ $(this).html()); return false; }); Cliquer ici

Modifier un élément sur un clic $(document).ready(function(){ $("a").mouseenter(function(){ $(this).html("Survol du lien"); }); $("a").mouseleave(function(){ $(this).html("Cliquez ici"); }); Cliquez ici

Utilisation de styles CSS et d'éléments XHTML ElémentCodageExemple une classe CSS$(".nom"), om nom est le nom de la classe$(".lien") une balise HTML/XHTML$("balise") où balise est la balise HTML/XHTML$("p") les éléments a contenus dans un élément did b$("#b > a")$("#conteneur > span") les éléments a contenus dans un élément b de classe c$("b.c > a")$("table.matable > th")