View
72
Download
3
Category
Preview:
Citation preview
Javascript & jQuery
1. Un programme javascript
1.1 Outils
Moteurs JavaScript pour le développement
Navigateur JSFiddleConsole
Les outils du développeur Javascript (1)
FireFox Chrome Chrome Canary
Les outils du développeur Javascript (2)
Sublime Text BracketsAtom.io
1.2 code javascript ?
Un fichier javascript
alert("Bazinga"); alert("Im not crazy."); alert("My mother had me tested");
Quelques commandes
alert("Suit up!"); console.log("Haaaaaave you met Ted?");
Commentaires
// Single Line Comments
/* Multi-line Comments */
1.3 Où mettre du javascript ?
JavaScript dans une page HTML (1)
<!doctype html> <html> <head></head> <body> <script> alert('Hello world!'); </script> </body> </html>
JavaScript dans une page HTML (2)
<!doctype html> <html> <head></head> <body> <script src="hello.js"></script> </body> </html>
2. jQuery
jQuery ?
jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML. jQuery is the most popular JavaScript library in use today. jQuery is free, open-source software licensed under the MIT License.https://en.wikipedia.org
Use jQuery
<!DOCTYPE html> <html lang="fr"> <head></head> <body> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> <script src="js/main.js"></script> </body> </html>
Document ready
$(document).ready(function() { alert('Hello'); }
Example : Smooth scroll
$('a[href^="#"]').click(function(){ var the_id = $(this).attr("href");
$('html, body').animate({ scrollTop:$(the_id).offset().top }, 'slow'); return false; });
Merci pour votre attention.
Recommended