Larentis Mattia - Mar 28, 2012 - ITI G. Marconi Rovereto Friday, April 13, 2012 

What is JavaScript? What is jQuery? Why would I want to use it? jQuery Tutorial Real Examples & Cool Stuff Links & Contacts Presentation Overview Friday, April 13, 2012 

What is JavaScript? An interpreted programming language with object oriented capabilities. java is to javascript as ham is to hamster [ http:/ /en.wikipedia.org/wiki/Javascript ] Friday, April 13, 2012 

What is jQuery? jQuery is a lightweight, open-source JavaScript library that simplifies interaction between HTML, CSS and JavaScript. jQuery is the most popular JavaScript library in use today (52% of most visited websites) [ http:/ /en.wikipedia.org/wiki/jQuery ] Friday, April 13, 2012 

Why would I want to use it? Easily insert, copy, move, remove elements Small amount of code for most tasks Add animations like slides, fades, resize, move, bounce Add widgets to pages (date pickers, dialogs, etc) Easy integration of Ajax Cross-browser compatibility Huge community, lots of plugins Friday, April 13, 2012 

JQuery Selectors p element name #id! identifier .class! classname p.class! element with class p a! anchor as any descendant of p p > a! anchor direct child of p Friday, April 13, 2012 

VS Friday, April 13, 2012 

Add Class document.getElementById('elementID').setAttribute ('class', 'newClass'); $('#elementID).addClass('newClass') Friday, April 13, 2012 

Show / Hide var element = document.getElementById('elementID'); if (element.style.display == 'block') element.style.display = 'none'; else element.style.display = 'block'; $("#elementID").toggle("slow"); Friday, April 13, 2012 

AJAX function GetXmlHttpObject(handler) { ! var objXmlHttp = null; / /Holds the local xmlHTTP object instance ! / /Depending on the browser, try to create the xmlHttp object ! if (is_ie) { ! var strObjName = (is_ie5) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP'; ! try { ! objXmlHttp = new ActiveXObject(strObjName); ! objXmlHttp.onreadystatechange = handler; ! } ! catch(e){ ! / /Object creation errored ! alert('Verify that activescripting and activeX controls are enabled'); ! return; ! } ! } ! else{ ! / / Mozilla | Netscape | Safari ! objXmlHttp = new XMLHttpRequest(); ! objXmlHttp.onload = handler; ! objXmlHttp.onerror = handler; ! } ! / /Return the instantiated object ! return objXmlHttp; } $.get("/my_view/", {data: "my_data"} ); ARE YOU FU*KING KIDDING ME? Friday, April 13, 2012 

Let’s try something Friday, April 13, 2012 

Real Examples & Cool Stuff http:/ /nivo.dev7studios.com/demos/ http:/ /www.zurb.com/playground/jquery- raptorize http:/ /www.professorcloud.com/mainsite/ cloud-zoom.htm Friday, April 13, 2012 

Links http:/ /www.jquery.com http:/ /www.jqueryui.com http:/ /www.learningjquery.com Friday, April 13, 2012 

My contacts http:/ /www.larentis.eu [email protected] @SpiritualGuru https:/ /www.facebook.com/Nostalgiaz https:/ /github.com/nostalgiaz Friday, April 13, 2012