Création de pages Web dynamiques et sympathiques.

Présentation au sujet: "Création de pages Web dynamiques et sympathiques."— Transcription de la présentation:

1 Création de pages Web dynamiques et sympathiques

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

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

4 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é');} );

5 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

6 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

7 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")