1 / 19

COS 125

COS 125. DAY 20. 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. New time line. April 13 Scripts Part 1 16 Assignment 9 due Scripts part 2 20 PodCasting & RSS

gzifa
Download Presentation

COS 125

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  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

  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 <script type=“text/javascript” language=“JavaScript”> …. javascript commands ….. </script> • 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/examples/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”> </script> http://www.cookwood.com/html6ed/examples/scripts/extern.html http://www.cookwood.com/html6ed/examples/scripts/extscript.txt

  9. User triggered scripts • Scripts can be activated by user events • Different elements have different events • <body> 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 <img> • 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/examples/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 <button type="button" name="time" onclick="alert('Today is '+ Date())" style="font: 24px 'Helvetica', 'Arial', sans-serif; background:yellow;color:red;padding:4px"> What time is it? </button> http://www.cookwood.com/html6ed/examples/scripts/button.html

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

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

  17. Hiding scripts from XML parsers <script type="text/javascript" language="javascript"> <![CDATA[ document.write("<p align='right'><i>"+Date()+"<\/i><\/p>") ]]> </script>

  18. Setting a default Script language • In the head sections type <meta http-equiv="Content-Script-Type" content="text/javascript" />

  19. More on JavaScript • http://www.w3schools.com/js/default.asp • http://javascript.internet.com/ • http://www.javascriptkit.com/jsref/ • http://www.echoecho.com/javascript.htm

More Related