DHTML: Cross-browser Techniques
Overview
TCCIT Solutions provides high quality, affordably priced, training classes in DHTML. With experienced instructors and a convenient midtown NYC location, we offer DHTML courses for the corporate community. TCCIT Solutions offers group classes and private tutoring to beginner and more advanced corporate clients in DHTML. We offer onsite training or classes at our facility on 34th Street and Madison in New York City.
Description
DHTML: Cross-browser Techniques (Second Edition) is a hands-on instruction book that will present ways you can add Dynamic HTML effects to your Web pages.
Prerequisites
This is an advanced course. To successfully complete this course, you must be comfortable programming in JavaScript. DHTML builds strongly on the foundation of JavaScript. You must be proficient at creating Web pages through HTML coding and formatting the content of those Web pages with Cascading Style Sheets (CSS). Furthermore, you should know how to use Netscape Navigator versions 4.x and 6.x, and Internet Explorer 4.x, 5.x, and 6.x. At minimum, you should have taken both courses listed below or have equivalent experience. Additionally, you will be even better prepared to meet the challenges of this course if you have taken JavaScript Advanced Programming course, though that is not a requirement.
Delivery Method
Instructor-led, group-paced, classroom-delivery learning model with structured hands-on activities.
Objective:
Students will be able to add interactivity, animation, and dynamic features to their Web pages.
Target Student
Students enrolling in this course should be interested in creating dynamic HTML elements, including animation and stylistic effects.
Course Objectives
Lesson objectives help students become comfortable with the course, and also provide a means to evaluate learning.
Upon successful completion of this course, students will be able to:
- Describe the component technologies of DHTML, define Document Object Model (DOM), describe the DOMs from both Navigator 4.x and Internet Explorer 4.x-5.x, and compare the early DOM models to determine similarities and overlap. You'll also be able to create dynamic images that change when the mouse pointer is placed over them.
- Describe the W3C-standard DOM and use it to examine a document's hierarchy and to access document components.
- Use DOM-enabled methods to change styles associated with page elements.
- Animate elements using DOM-standard methods and properties.
- Modify the document structure, write to existing elements, read and write attributes, and create and delete page elements all using DOM-standard techniques.
- Examine the real-world difficulties of creating cross-browser DHTML-enabled Web pages, as well as the techniques for dealing with those challenges. You will also be able to write a constructor function that defines the DHTML-enabling ActiveElement custom object.
- Add methods to a custom object, describe the prototype-based inheritance model of JavaScript, and add secondary methods to a custom object through linked-in libraries.
- Move elements on the page by using methods of the custom ActiveElement object.
- Add clipping effects through methods of the ActiveElement object.
- Get user input through mouse events.
- Enable drag-and-drop functionality that relies on handling mouse events, create drop-down menus that are enabled by events, and create auto-generating code.
Course Content
Lesson 1: DHTML and the Document Object Model
- Topic 1A: DHTML Defined
- Topic 1B: Document Object Model Beginnings
- Topic 1C: The Level 0+ DOMs
- Topic 1D: DOM Standards
Lesson 2: The W3C HTML DOM
- Topic 2A: Page Hierarchy
- Topic 2B: Standard Methods and Properties
Lesson 3: Changing Styles
- Topic 3A: Exploring the Style Object
- Topic 3B: Changing Styles
- Topic 3C: The DOCTYPE Switch
Lesson 4: Animating Page Elements
- Topic 4A: Positioning Elements on the Page
- Topic 4B: Moving Elements
Lesson 5: Modifying the Document Structure
- Topic 5A: Reading From and Writing to Existing Elements
- Topic 5B: Reading, Writing, and Adding Attributes and Values
- Topic 5C: Creating Nodes
- Topic 5D: Removing and Replacing Nodes
Lesson 6: Creating the Core DHTML Library
- Topic 6A: Coding for Backward Compatibility
- Topic 6B: The Custom Object Technique
Lesson 7: Adding Methods to the Custom Object
- Topic 7A: Adding Methods
- Topic 7B: Adding Secondary Methods to the ActiveElement Object
Lesson 8: Moving Elements on the Page
- Topic 8A: Moving in Geometric Shapes
Lesson 9: Clipping
- Topic 9A: Clipping
- Topic 9B: Clipping With Code
Lesson 10: Getting User Input With Events
- Topic 10A: Events
- Topic 10B: Event Information
- Topic 10C: Events and the ActiveElement Object
Lesson 11: Applying Mouse Events
- Topic 11A: Dragging and Dropping
- Topic 11B: Drop-down Menus
Appendix A: ActiveElement Reference
Additional Info
Additional appendices are provided as PDF files accompanying the student data files. |