The Web Wizard’s Guide To JavaScript Chapter 9 Applied Web Programming Techniques.

Slides:



Advertisements
Similar presentations
Essentials for Design JavaScript Level One Michael Brooks
Advertisements

The Web Warrior Guide to Web Design Technologies
The Application Layer Chapter 7. Electronic Mail Architecture and Services The User Agent Message Formats Message Transfer Final Delivery.
1 A Balanced Introduction to Computer Science, 2/E David Reed, Creighton University ©2008 Pearson Prentice Hall ISBN Chapter 7 Event-Driven.
Information Technology Center Hany Abdelwahab Computer Specialist.
Macromedia Dreamweaver 4 Advanced Level Course. Add Rollovers Rollovers or mouseovers are possibly the most popular effects used in designing Web pages.
JavaScript 101 Lesson 5: Introduction to Events. Lesson Topics Event driven programming Events and event handlers The onClick event handler for hyperlinks.
HCI 201 Week 5 Loose Ends. Agenda Image stuff Image stuff File stuff File stuff Bandwidth Bandwidth UNIX UNIX HTML HTML Design elements Design elements.
Unit 2, Lesson 5 Website Development Tools AOIT Web Design Copyright © 2008–2012 National Academy Foundation. All rights reserved.
Web Design Basic Concepts.
Problemsolving 2 Problem Solving: Designing a website solution Identifying how a solution will function Taking into account the technical constraints a.
What is Web Design?  Web design is the creation of a Web page using hypertext or hypermedia to be viewed on the World Wide Web.
INTRODUCTION TO DHTML. TOPICS TO BE DISCUSSED……….  Introduction Introduction  UsesUses  ComponentsComponents  Difference between HTML and DHTMLDifference.
_______________________________________________________________________________________________________________ E-Commerce: Fundamentals and Applications1.
Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.
The Web Wizard’s Guide To JavaScript Chapter 1 JavaScript Basics.
CS346 - Javascript 1, 21 Module 1 Introduction to JavaScript CS346.
© Cheltenham Computer Training 2001 Macromedia Dreamweaver 4 - Slide No 1 Macromedia Dreamweaver 4 Advanced Level Course.
Chapter 18 Web Design April 16 th & 17 th. Content The most essential element of any Web page is the content Before you begin a Web page you want to know.
INTRODUCTION TO FRONTPAGE. TOPICS TO BE DISCUSSED……….  Introduction Introduction  Features Features  Starting Front Page Starting Front Page  Components.
Event Handlers CS101 Introduction to Computing. Learning Goals Learn about event handlers Determine how events are useful in JavaScript Discover where.
Chapter 2 Developing a Web Page. Chapter 2 Lessons Introduction 1.Create head content and set page properties 2.Create, import, and format text 3.Add.
Chapter 2 Developing a Web Page. A web page is composed of two distinct sections: –The head content –The body Creating Head Content and Setting Page Properties.
10 Adding Interactivity to a Web Site Section 10.1 Define scripting Summarize interactivity design guidelines Identify scripting languages Compare common.
DHTML: Dynamic HTML Internet Technology1. What is DHTML? A collection of enhancements to HTML ► To create dynamic and interactive websites Combination.
SEG3210 DHTML Tutorial. DHTML DHTML is a combination of technologies used to create dynamic and interactive Web sites. –HTML - For creating text and image.
Integrating JavaScript and HTML5 HTML5 & CSS 7 th Edition.
Section 17.1 Add an audio file using HTML Create a form using HTML Add text boxes using HTML Add radio buttons and check boxes using HTML Add a pull-down.
INTRODUCTION TO JAVASCRIPT AND DOM Internet Engineering Spring 2012.
Extending HTML CPSC 120 Principles of Computer Science April 9, 2012.
Javascript II DOM & JSON. In an effort to create increasingly interactive experiences on the web, programmers wanted access to the functionality of browsers.
DHTML - Introduction Chapter Introduction to DHTML, the DOM, JS review.
Interactive Client-Side Technologies MMIS 656 Web Design Technologies Acknowledgements: Estrella, S. (2003). The Web Wizard’s Guide to DHTML and CSS.
JavaScript - A Web Script Language Fred Durao
Cs332a_chapt10.ppt CS332A Advanced HTML Programming DHTML Dynamic Hypertext Markup Language A term describing a series of technologies Not a stand-a-lone.
Scott Marino MSMIS Summer Session Web Site Design and Authoring Session 8 Scott Marino.
How the Web Works Building a Website – Lesson 1. How People Access the Web Browsers People access websites using software called a web browser. To view.
By Tharith Sriv. To write a web page you use: HHTML (HyperText Markup Language), AASP (Active Server Page), PPHP (HyperText Preprocessor), JJavaScript,
HTML JAVASCRIPT. CONTENTS Javascript Example NOSCRIPT Tag Advantages Summary Exercise.
HTML Overview Part 5 – JavaScript 1. Scripts 2  Scripts are used to add dynamic content to a web page.  Scripts consist of a list of commands that execute.
Introduction to HTML. _______________________________________________________________________________________________________________ 2 Outline Key issues.
Asstt. Prof Sonia Sharma Computer Dept 1 HTML ( Hypertext MarkUP Language ) HTML is the lingua franca for publishing hypertext on the World Wide Web.
The Web Wizard’s Guide To DHTML and CSS Chapter 8 Putting It All Together and Moving Forward.
The Web Wizard’s Guide To DHTML and CSS Chapter 2 A Review of CSS2 and JavaScript.
ET-710 WEB-DESIGN By Bart Chuchro Queensborough Community College.
JavaScript Introduction and Background. 2 Web languages Three formal languages HTML JavaScript CSS Three different tasks Document description Client-side.
Project 5: Customizing User Content Essentials for Design JavaScript Level Two Michael Brooks.
Understanding Web-Based Digital Media Production Methods, Software, and Hardware Objective
Learning Aim C.  Creating web pages involves many considerations.  In this section we will look at the different software tools you can use and how.
CSC 121 Computers and Scientific Thinking Fall Event-Driven Programming.
JavaScript Events. Understanding Events Events add interactivity between the web page and the user Events add interactivity between the web page and the.
introductionwhyexamples What is a Web site? A web site is: a presentation tool; a way to communicate; a learning tool; a teaching tool; a marketing important.
The Web Wizard’s Guide To JavaScript Chapter 4 Image Swapping.
Client-side processing 26 Client-side processing 26.
Section 10.1 Define scripting
Web Basics: HTML/CSS/JavaScript What are they?
Project 1 Introduction to HTML.
Using DHTML to Enhance Web Pages
Department of Computer Science
The Internet and HTML Code
Section 17.1 Section 17.2 Add an audio file using HTML
Section 10.1 YOU WILL LEARN TO… Define scripting
The Web Wizard’s Guide To DHTML and CSS
The Web Wizard’s Guide To JavaScript
The Web Wizard’s Guide To JavaScript
The Web Wizard’s Guide To JavaScript
Web Design and Development
Computer communications
Introduction to JavaScript
Presentation transcript:

The Web Wizard’s Guide To JavaScript Chapter 9 Applied Web Programming Techniques

Chapter Objectives To learn how to use a triple nested loop to generate an interactive table of Web-safe colors To discover how to combine JavaScript with client-side image mapping to enhance the user interface of your Web pages To find out how to detect the visitor’s browser and platform To understand how to change the text displayed in the visitor’s status bar to provide your own content To learn how to create scrolling text in a text field To get a glimpse of how Dynamic HTML and Cascading Style Sheets can boost the power of your JavaScript programming

Generating Content with Nested Looping You can use a short group of nested loops to create lengthy and complex tables that include background colors and JavaScript code. When you include quotes within quotes within quotes, you may need to escape the most deeply nested quote using the backslash character.

JavaScript and Client-Side Image Mapping By using client-side image maps with JavaScript, you can create novel and compelling user interfaces that involve substantial interactivity. You can use pseudo-URLs and onclick handlers to execute JavaScript code when links and map areas are clicked.

Browser Detection Browser detection is often necessary to deliver different content for different browsers and platforms. Browser detection scripts (sniffers) are ideal candidates for placement in external code libraries such as your mylibrary.js file.

Text in the Status Bar You can control the text that is displayed in the status bar of visitors’ computers. To avoid interfering with status messages coming from the browser, be sure to place only temporary information in the status bar. An example is a short message that appears when visitors move the mouse over a link.

Scrolling Text in a Field Scrolling text in a form field is an economical, low- bandwidth way to attract the attention of visitors to important announcements on your page.

What’s Next? Your new skills in JavaScript programming will assist you in creating Dynamic HTML and using authoring environments such as Flash and Director. Dynamic HTML is the combination of JavaScript, HTML 4, and Cascading Style Sheets. Flash and Director are two of many products that use JavaScript or JavaScript-like languages to create interactivity.