1. Chapter 1 Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc.Slide 1

2. Objectives Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 2

3. Objectives (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 3

4. Objectives (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 4

5. The components of a web application Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 5

6. Terms Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 6

7. A static web page at http://www.modulemedia.com/ourwork/index.html Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 7

8. How a web server processes a static web page Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 8

9. A dynamic web page at amazon.com Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 9

10. How a web server processes a dynamic web page Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 10

11. A web page with image swaps and rollovers Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 11

12. How JavaScript fits into this architecture Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 12

13. Some of the uses of JavaScript and jQuery Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 13

14. An HTML file (index.html) in a browser after CSS has been applied to it Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 14

15. The code for the HTML file named index.html Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 15

16. The HTML file named index.html (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 16

17. The code for the CSS file named email_list.css Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 17

18. The CSS file named email_list.css (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 18

19. The web page in a browser with JavaScript used for data validation Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 19

20. The code for the JavaScript file (email_list.js) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 20

21. The JavaScript file (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 21

22. The primary HTML5 semantic elements Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 22

23. A page that’s structured with HTML5 elements Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 23

24. The HTML in a web browser Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 24

25. The JavaScript shiv that tells older browsers about the HTML5 elements Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 25

26. Terms Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 26

27. HTML div elements for a JavaScript application Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 27

28. HTML span elements for a JavaScript application Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 28

29. The basic HTML attributes Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 29

30. HTML that uses these attributes Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 30

31. The HTML in a web browser with a tooltip displayed for the text box Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 31

32. Two ways to provide styles Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 32

33. A head element that includes two style sheets Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 33

34. How to specify the medium for a style sheet Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 34

35. HTML that can be selected by type, id, or class Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 35

36. CSS rule sets that select by type, id, and class Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 36

37. The HTML elements in a browser Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 37

38. The CSS file for a typical application in this book Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 38

39. The CSS file for a typical application (continued) Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 39

40. Terms Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 40

41. The web page at c:/jquery/book_apps/ch01/email_list.html Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 41

42. Four ways to run an HTML page that’s on your own server or computer Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 42

43. Two ways to run an HTML page on the Internet Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 43

44. The components of an HTTP URL on the Internet Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 44

45. The HTML5 ratings of current browsers Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 45

46. Guidelines for cross-browser compatibility Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 46

47. The workarounds for using HTML5 semantics Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 47

48. How to test your web pages in older browsers Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 48

49. The last dialog box for creating an Aptana project Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 49

50. How to create a project Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 50

51. Aptana with the App Explorer shown and a JavaScript file in the second tab Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 51

52. How to open a file within an Aptana project Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 52

53. Aptana’s Themes dialog box Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 53

54. How to apply a new theme for Aptana Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 54

55. Aptana with an auto-completion list for a JavaScript entry Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 55

56. To run a web page, click on Aptana’s Run button Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 56 Run button

57. To rerun a web page in a browser, clicking on the Reload button Murach's JavaScript and jQuery, C1© 2012, Mike Murach & Associates, Inc. Slide 57 Reload button