1. COS 125 DAY 20

2. Agenda Assignment 8 not corrected yet Assignment 9 posted  Due April 16 New course time line Discussion on Scripts  http://www.cookwood.com/html6ed/examples/#c19 http://www.cookwood.com/html6ed/examples/#c19

3. New time line April  13 Scripts Part 1  16 Assignment 9 due Scripts part 2  20 PodCasting & RSS Progress report  23 Assignment 10 due Quiz 3  27 Capstones & Presentations Due

4. Adding scripts to xHTML Scripts are little program that add activity to web pages Scripts are the basis for DHTML  Covered in COS 381 Mostly all web script is done in JavaScript  Only similarity with JAVA is the name

5. Adding scripts Two types  Scripts that require user action  Scripts that do not require user action called automatic scripts Automatic scripts  Executed by the browser when the page is loaded  If there is more than one script they are loaded in the order they appear in the web page

6. Adding a script …. javascript commands ….. language is deprecated If you want the script to load before the web page loads  place the script in the head section

7. A simple script http://www.cookwood.com/html6ed/ex amples/scripts/simple.html http://www.cookwood.com/html6ed/ex amples/scripts/simple.html

8. External script You can separate the JavaScript and place it in a file (*.js) and call it from inside the xHTML page <script type=“text/javascript” language=“JavaScript” src=“script.url”> http://www.cookwood.com/html6ed/examples/scripts/ex tern.html http://www.cookwood.com/html6ed/examples/scripts/ex tscript.txt

9. User triggered scripts Scripts can be activated by user events Different elements have different events  Events onload >> Script to be run when a document load onunload >> Script to be run when a document unloads

10. Form events The attributes below can be used in form elements: onblur >> Script to be run when an element loses focus onchange >> Script to be run when an element change onfocus >> Script to be run when an element gets focus onreset >> Script to be run when a form is reset onselect >> Script to be run when an element is selected onsubmit >>Script to be run when a form is submitted

11. Mouse events Valid in all elements except base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, and title.  onclick >> Script to be run on a mouse click  ondblclick >> Script to be run on a mouse double-click  onmousedown >> Script to be run when mouse button is pressed  onmousemove >> Script to be run when mouse pointer moves  onmouseout >> Script to be run when mouse pointer moves out of an element  onmouseover >> Script to be run when mouse pointer moves over an element  onmouseup >> Script to be run when mouse button is released

12. Other events Image events  onabort >> Script to be run when loading of an image is interrupted Keyboard events Valid for all elements except base, bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, and title. onkeydown >> Script to be run when a key is pressed onkeypress >> Script to be run when a key is pressed and released onkeyup >> Script to be run when a key is released

13. Link a script to a user event In the opening tag of whatever element you wish to be associated with the script type event_type =“some script” EX. onclick=“alert(‘here is today\’s’ + Date())” http://www.cookwood.com/html6ed/example s/scripts/time.html

14. Buttons to launch scripts You can create a Button to launch a script by associating a script with the onclick user event for the button What time is it? http://www.cookwood.com/html6ed/examples/scripts/button.html

15. Alternate Information Used for browsers that cannot (or will not) run scripts ….. xHTML code …. http://www.cookwood.com/html6ed/examples/scripts/noscript.html

16. Hiding Scripts from old browsers After opening script tag enclose your JavaScript with the following <! -- JavaScript code // -- >

17. Hiding scripts from XML parsers "+Date()+" ") ]]>

18. Setting a default Script language In the head sections type

19. More on JavaScript http://www.w3schools.com/js/default.a sp http://www.w3schools.com/js/default.a sp http://javascript.internet.com/ http://www.javascriptkit.com/jsref/ http://www.echoecho.com/javascript.ht m http://www.echoecho.com/javascript.ht m