Presentation is loading. Please wait.

Presentation is loading. Please wait.

Slide 1 MIS3023 Professor: Akhilesh Bajaj The University of Tulsa.

Similar presentations


Presentation on theme: "Slide 1 MIS3023 Professor: Akhilesh Bajaj The University of Tulsa."— Presentation transcript:

1 Slide 1 MIS3023 Professor: Akhilesh Bajaj The University of Tulsa

2 Slide 2 Goals -Download all the files for the book from the textbook website. -Create a folder for our class and run some sample code -Decide which editor to use: Aptana, Notepad++ -Learn how to use Firebug to step through a program and see how it visually executes -Learn about the big picture of the Web and where JavaScript fits in

3 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 3

4 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 4

5 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 5

6 Slide 6

7 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 7

8 Slide 8

9 © 2012, Mike Murach & Associates, Inc.Slide 9

10 © 2012, Mike Murach & Associates, Inc.Slide 10

11 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 11 All images are loaded with the web page to the client. The client then does some of the processing using JavaScript.

12 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 12 Image rollover Image swap

13 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 13

14 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 14 Attribute of img element Opening Tag of HTML element with lang attribute defined

15 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 15

16 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 16 In the section of the HTML document

17 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 17  Rule Set selector Declaration block

18 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 18

19 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 19

20 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 20

21 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 21

22 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 22

23 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 23

24 Murach's HTML5 and CSS3, C1© 2012, Mike Murach & Associates, Inc.Slide 24

25 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 25

26 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 26

27 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 27

28 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 28

29 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 29

30 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 30

31 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 31

32 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 32

33 © 2009, Mike Murach & Associates, Inc. Slide 33

34 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 34

35 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 35

36 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 36

37 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 37

38 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 38

39 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 39

40 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 40

41 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 41

42 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 42

43 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 43

44 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 44

45 Murach’s JavaScript, C1© 2009, Mike Murach & Associates, Inc. Slide 45

46 Slide 46 Fun In Class Assignment Chapter 1 -Copy the sales tax application pages (the.html, the.css and the.js files) into a separate folder called FunInClassChapt1 ). -Run the code to make sure it works from this folder. -Modify the code to do the following: -Have the user input shipping charges as an additional field before the salesTax and total fields. Call it shippingCharges. -Check to make sure a number is entered for this new field -Total should now include shipping charges as well. -Play with the CSS to make the interface look a little better. For example, the fields may need some spacing around them. They seem a little close together. Try changing the background color.

47 Slide 47 Fun In Class Assignment Chapter 1 with Prompts -Copy the folder created in the earlier assignment and rename the copied folder to Sales_tax_prompts -Run the code to make sure it works from this folder. -Modify the code to do the following: -Modify the HTML page so it only shows the output fields: Sales Tax and Total -Accept the inputs for subTotal, taxRate and shippingCharges as prompts. -Check to make sure a number is entered for this new field -Total should now include shipping charges as well.


Download ppt "Slide 1 MIS3023 Professor: Akhilesh Bajaj The University of Tulsa."

Similar presentations


Ads by Google