1 Lesson 9 Using JavaScript with Frames HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.

Slides:

Advertisements

Similar presentations

Working with Forms. how are forms manipulated? the document object contains an array of forms objects, one for each form, in document order –forms[] any.

Advertisements

© 2010 Delmar, Cengage Learning Chapter 9 Positioning Objects with AP Div Tags.

Essentials for Design JavaScript Level One Michael Brooks

1 Lesson 5 Introduction to Cascading Style Sheets HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.

1 Lesson 10 Using JavaScript with Styles HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.

Image Maps and Graphics Internet Basics and Far Beyond! Mrs. Wilson.

Create slices and hotspots Create links in Web pages Create rollovers from slices Create basic animation Add tweening symbol instances to create animation.

Computer Science 103 Chapter 4 Advanced JavaScript.

Tutorial 8 Designing a Web Site with Frames. XP Objectives Explore the uses of frames in a Web site Create a frameset consisting of rows and columns of.

JavaScript 101 Lesson 5: Introduction to Events. Lesson Topics Event driven programming Events and event handlers The onClick event handler for hyperlinks.

JavaScript, Third Edition

Chapter 9 Introduction to the Document Object Model (DOM) JavaScript, Third Edition.

Unit 2 — The Exciting World of JavaScript Lesson 8 — Using JavaScript with Frames.

3.2 Presentation Software End Show Creating slide shows including audio,video and digital images End Show.

Glencoe Digital Communication Tools Create a Web Page with HTML Chapter Contents Lesson 4.1Lesson 4.1 Get Started with HTML (85) Lesson 4.2Lesson 4.2 Format.

Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: Frames © 2007 Prosoft Learning Corporation All rights reserved ITD 110 Web Page Design.

Lesson 4 HTML Structural Design Techniques

Copyright © 2004 ProsoftTraining, All Rights Reserved. Lesson 9: HTML Frames.

PowerPoint 2007 © : The Power of Presentations How can Microsoft PowerPoint 2007 help you finalize a presentation for an audience?

Lesson 8 Creating Forms with JavaScript

Chapter 12 Creating and Using XML Documents HTML5 AND CSS Seventh Edition.

Lesson 17 Enhancing Presentations with Multimedia Effects

1 Advanced Frame Options Using NORESIZE  By default, users may resize frames unless you specify the NORESIZE attribute in the tag  Examples:

Chapter 3 Dreamweaver: Part I The Web Warrior Guide to Web Design Technologies.

Chapter 5 Java Script And Forms JavaScript, Third Edition.

XP 1 Tutorial 5 Using Frames in a Web Site. XP 2 Tutorial Objectives  Describe the uses of frames in a Web site  Lay out frames within a browser window.

4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.

Dreamweaver MX Unit A CIS 205—Web Site Design & Development.

A Power Point Presentation For... A Power Point Presentation ( click to advance slides )

Adding User Interactivity – Lesson 51 Adding User Interactivity Lesson 5.

Intro to Dreamweaver Web Design Section 7-1 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development I” Course.

1 Lesson 7 Using Images with JavaScript HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.

Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and attributes Create.

Making a Game Linking Slides. To link slides: 1.Prepare your storyboard 2.Complete all slides 3.Link the slides.

HTML Concepts and Techniques Fourth Edition Project 6 Using Frames in a Web Site.

Tutorial 8 Designing a Web Site with Frames. XP Objectives Explore the uses of frames in a Web site Create a frameset consisting of rows and columns of.

1 Lesson 3 Power Techniques HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner.

Chapter 10 Fireworks: Part II The Web Warrior Guide to Web Design Technologies.

Creating Links – Lesson 31 Creating Links Lesson 3.

JavaScript, Fourth Edition

Week 11 Creating Framed Layouts Objectives Understand the benefits and drawbacks of frames Understand and use frame syntax Customize frame characteristics.

1 Week Four– Advance HTML 2 Dr. Fadi Safieddine. 2 Lecture Content Basic HTML Tables Using based Feedback form Creating and Using Image Maps Nested.

Chapter 8 HTML Frames. 2 Principles of Web Design Chapter 8 Objectives Understand the benefits and drawbacks of frames Understand and use frames syntax.

Chapter 5 Quick Links Slide 2 Performance Objectives Understanding Framesets and Frames Creating Framesets and Frames Selecting Framesets and Frames Using.

 2003 Prentice Hall, Inc. All rights reserved. Introduction to HTML: Frames Outline 1 Introduction 2 frameset Element 3 Nested frameset s 4 Web Resources.

Tutorial 8 Designing a Web Site with Frames. 2New Perspectives on HTML, XHTML, and XML, Comprehensive, 3rd Edition Objectives Explore the uses of frames.

Lotus 认证培训 Notes Domino 6/6.5 Application Development Foundation Skills （ 610 ） Exam Number: 610 Competencies: Please see exam guide. Length:

Committed to Shaping the Next Generation of IT Experts. Essentials For Design Dreamweaver Level One Julian Rickards Project 7 Frames.

XHTML Hyperlinks. Creating Links to Other Web Pages A link, or hyperlink, is a specially formatted Web page object that the user can click to open a different.

Building the Events Components– Lesson 111 Building the Events Components Lesson 11.

Project 10: Exploring the Window Object Essentials for Design JavaScript Level One Michael Brooks.

JavaScript, Fourth Edition Chapter 4 Manipulating the Browser Object Model.

4 HTML Basics Section 4.1 Format HTML tags Identify HTML guidelines Section 4.2 Organize Web site files and folder Use a text editor Use HTML tags and.

CreatingClasses-SlideShow-part41 Creating Classes part 4 Barb Ericson Georgia Institute of Technology Dec 2009.

XP Tutorial 7 Creating a Flash Web Site. XP New Perspectives on Macromedia Flash 82 Objectives Plan and create a Flash Web site Create a Flash template.

Unit 2, Lesson 7 Creating Web Pages and Web Documents.

USING JAVASCRIPT TO SHOW AN ALERT Web Design Sec 6-2 Part or all of this lesson was adapted from the University of Washington’s “Web Design & Development.

Document Object Model Nasrullah. DOM When a page is loaded,browser creates a Document Object Model of the Page.

CHAPTER 7 LESSON C Creating Database Reports. Lesson C Objectives  Display image data in a report  Manually create queries and data links  Create summary.

1 Lesson 6 Introducing JavaScript HTML and JavaScript BASICS, 4 th Edition.

Site Development Foundations © 2004 ProsoftTraining All rights reserved.

XP New Perspectives on Macromedia Dreamweaver MX 2004 Tutorial 5 1 Adding Shared Site Elements.

Adding Interactivity Comp 140 Fall Web 2.0 Major change in internet usage –From mostly static pages Text Graphics Simple links –To new paradigm.

JavaScript, Third Edition 1 SELECTION LIST Demo. JavaScript, Third Edition 2 Description This web page will edit the slection to ensure an option was.

Section 4.1 Section 4.2 Format HTML tags Identify HTML guidelines

Programming Web Pages with JavaScript

In this session, you will learn to:

Using JavaScript to Show an Alert

Exercise 34 - Skills The Assets panel’s library feature enables you to insert and change elements automatically on multiple pages in your site. You can.

Presentation transcript:

1 Lesson 9 Using JavaScript with Frames HTML and JavaScript BASICS, 4 th Edition Barksdale / Turner

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 22 Objectives Create a JavaScript function with a parameter list. Create JavaScript-enabled hyperlinks that affect frames. Create JavaScript-enabled buttons that affect frames. Create top-level JavaScript functions.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 33 Vocabulary child document function parameter parameter list parent document parent object top object

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 44 Advanced JavaScript Programming Frame-based Web page A Web page that contains a frameset includes a file that defines the frameset and two or more additional files that define the frames within that frameset.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 55 Advanced JavaScript Programming (continued) The frameset file is known as the parent document, and the frame files contained within the frameset are known as child documents.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 66 Adding JavaScript Code to Your Frameset All JavaScript function definitions include a parameter list, which is a list of data items that the function needs to perform its intended action. A function parameter is simply an object or data element that is accessed by an assigned name within the function. A parent object is a reserved word in JavaScript that refers to the parent frameset.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 77 Adding JavaScript Code to Your Frameset (continued) Web page with functional hyperlinks By using the JavaScript function parameter to distinguish one hyperlink from another, it is not necessary to define a function for each hyperlink.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 88 Creating a Frame-Based Slide Show In Lesson 7, you created an electronic slide show that allowed the user to change the image displayed by clicking hyperlinks or buttons. In this lesson, you create a frame-based Web page that performs essentially the same function. Begin by creating the basic frameset and the frames that it contains.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 99 Using the Parent/Child Relationship For a JavaScript function to access an object in a different file, the two files must be linked. In this example, the upper1.html and the lower2.html files are both contained within a common parent frameset, and this frameset can be referenced via the JavaScript object called parent.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 10 Making Your Slide Show Buttons Functional Functional frame-based slide show Web page There is more than one way to make the slide show buttons functional. With framesets there are multiple ways to solve a problem.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 11 Making Your Slide Show Buttons Functional (continued) In this case, you start by defining a four- element image array to contain the four graphics that make up the slide show. You also add two new JavaScript functions called prevImage() and nextImage() that change the image that is currently displayed in the upper frame and a startup() function to initialize the image array.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 12 Making Your Slide Show Buttons Functional (continued) Next, you add an onClick event to each of the two buttons that were defined in the lower frame document.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 13 Creating a Top-Level JavaScript Function When working with nested framesets, you can access any frame you want by developing the proper sequence of JavaScript parent objects. If you place JavaScript function definitions in the top-level frameset file, every HTML document easily access these functions by using the JavaScript top object.

Lesson 9 Barksdale / TurnerHTML and JavaScript BASICS 4E 14 Summary In this lesson, you learned: How to create a JavaScript function with a parameter list. How to create JavaScript-enabled hyperlinks that affect frames. How to create JavaScript-enabled buttons that affect frames. How to create top-level JavaScript functions.