Add dynamic interactivity to your Web site with DHTML and
Cascading Style Sheets!
- Targeted to designers and content creators, not just
programmers.
- Visual, task-based format the ideal way to get up and
running with DHTML.
This revised and expanded second edition is up-to-date
on the current Web standards and browsers, and includes all
new coverage of using DHTML to get information about the
browser environment and adding multimedia to a site, as
well as new basic and advanced dynamic techniques, such as
making objects appear and disappear, moving objects in 3D,
and adding dynamic content. This edition offers full
cross-platform and cross-browser coverage. This book does
not focus on the more complex aspects of DHTML, but focuses
on practical examples of what really works with DHTML and
CSS, making it useful for beginners just starting out with
DHTML, as well as professional developers looking for a
quick reference.
Contents
Introduction.
Who Is This Book For?
Everyone Is a Web Designer. Understanding the Environment.
What Is an Element? What Is an Object? What Is CSS? What Is
DHTML? The Flavors of DHTML. Flash v. DHTML. The Current
Web Standards. What Tools Do You Need for This Book? Values
and Units Used in This Book. The DHTML VQS Websites.
I. CASCADING STYLE SHEETS.
1. Understanding CSS. What Is a Style? What Are
Cascading Style Sheets? Who Owns CSS? Understanding HTML
Tags (Selectors). Kinds of HTML Tags. Understanding CSS
Definitions.
2. CSS Basics: Setting Up Styles. Adding CSS to an HTML Tag.
Adding CSS to a Web Page. Adding CSS to a Website.
Redefining an HTML Tag. Defining Classes to create your Own
Elements. Creating your Own Inline HTML Tags. Creating your
Own Block-Level HTML Tags. Defining IDs to Identify an
Object. Defining Tags with the Same Rules. Defining Tags in
Context. Determining the Cascade Order. Setting up Multiple
Style Sheets in a Single Document. Making a Rule. External
Style Sheet Strategies. Inheriting Property from Parents.
Managing Preexisting or Inherited Property Values. Setting
the CSS for the Output Medium. Adding Comments to
CSS.
3. Font Controls. CSS v. The Font Tag.
Typography on the Web. Setting the Font. Downloading Fonts.
Using Browser Safe Fonts. Setting the Font Size. Making
Text Italic. Setting Bold, Bolder, Boldest. Setting up
Multiple Font Values.
4. TextControls. Adjusting the Kerning
(Letter Spacing). Adjusting the Word Spacing. Adjusting the
Leading (Line Spacing). Setting Text Case (Upper/Lower).
Justifying the Text (Left, Right, and Center). Aligning the
Text Vertically. Indenting Paragraphs. Controlling Text
Case (Upper or Lower). Decorating the Text (Underlining
Text). Controlling White Space. Setting Page Breaks for
Printing.
5. Border and Margin Controls. Understanding the Objects
Box. Setting an Element's Margins. Setting an Element's
Padding. Setting an Element's Border. Setting the Width and
Height of on Element. Wrapping Text around an Element (aka
"Floating"). Preventing Text from Wrapping. Telling an
Object how to Display (or Not).
6. Color and Background Controls. Setting a Foreground
Color. Setting a Background Color. Setting a Background
Image. Repeating a Background Image. Positioning a
Background on a Screen. Fixing Backgrounds on a Screen.
Setting the Hypertext Link Colors.
7. List & Mouse Controls. Setting the Bullet Style.
Creating a Hanging Indent. Creating your Own Bullets.
Setting up a List. Changing the Mouse Pointer's
Appearance.
8. Positioning Controls. Understanding the Window.
Setting Absolute, Relative, Fixed, or Static Positions for
Objects. Setting the Left and Top Margins for an Object.
Placing an Element anywhere in a Web Page. Offsetting
Elements Relative to their Natural Position. Fixing an
Element in the Browser Window. Using Static Positioning.
Nesting an Absolute Element in a Relative Element. Nesting
a Relative Element in an Absolute Element. Creating
Floating Element with Positions. Stacking Objects on Top of
Each Other (3-D Positioning).
9. Visibility Controls. Setting the Visibility of
an Element. Setting the Visible Area of an Element
(Clipping). Setting Where the Overflow Goes.
10. Page Layout with CSS. Layout with CSS v. Tables.
Creating Headlines. Creating a Side Bar. Creating a Title
Bar. Creating Drop Caps. Creating a Simple Drop Shadow.
Setting up Columns. Looking Good in Print (On the Web).
Making your Own Frame Borders.
II. DYNAMIC HTML.
11. The Document Object Model. the DOM: Road Map to Your
Web Page. How the DOM Works. The Object Flow. Creating An
Object (CSS Layers). The Netscape Layers DOM. The 'all'
DOM. The 'id' DOM. Event Handlers. Detecting an Event.
Using Feature Sensing. Detecting the DOM Type. Building a
Crossbrowser DOM.
12. Learning about Your Environment. Detecting the Browser Name
and Version. Detecting the Operating System. Finding the
Screen Dimensions. Finding the Browser Dimensions. Finding
the Page Dimensions. Finding an Objects Dimensions. Finding
an Objects Location.
13. Dynamic Techniques: the Basics. Making Things Appear.
Making Things Disappear. Making Things Change. Moving
Things from Point-to-point. Moving Things by a Certain
Amount. Moving Things in 3-D. Animating an Object. Setting
the Back ground Color.
14 Dynamic Techniques: Advanced. Dynamic Content between
Frames. Dynamic Content in Tables. Finding Your Location on
the Screen. Identifying an Object on the Screen.
15. Netscape Layers. What Is a Layer? Layers v.
ID. Creating a Layer. Using a Layer. Accessing Layers with
JavaScript. Modifying layers with JavaScript. Providing
Content for Non-layers Browsers.
16. IE's Visual Controls. Fading between Objects.
Transitions between pages. Making an Object Blur. Making an
Object Wave.
17. Dynamic CSS. Accessing a Property.
Changing a Property. Adding a New Rule. Dynamically.
Disabling a Rule.
III. USING DHTML & CSS
TOOLS.
18 GoLive. the GoLive Interface. The
CSS Control Palettes. Adding CSS to a Web Page. Defining an
Object (Floating Box). Using JavaScript Actions. The Time
Line Editor. Animating an Object. Adding Actions to an
Animation.
19. Dreamweaver. the Dreamweaver Interface.
The CSS Control Palettes. Adding CSS to a Web Page.
Defining an Object. Using JavaScript Behaviors. The Time
Line Inspector. Animating an Object.
20. Freeway. the Freeway Interface. The
CSS Palette. Adding CSS to a Web Page. Defining an Object.
Using JavaScript Actions. Animating an Object.
IV. CREATING A DYNAMIC
Website.
21. Planning a Dynamic Site. Understanding Hypertext.
Designing Better Hypertext. Creating a Design Document.
Creating a Site Map. Thinking in Motion. Providing
Navigation for Non-Dynamic browsers.
22. Importing External Content. Combining iLayers and
iFrames. Using Server Side Includes. Using an external
JavaScript File. Viewing Someone Else's External
Content.
23. Website Navigation. Website Navigation Dos.
Website Navigation Don'ts. Creating Drop-Down Menus.
Creating a Menu Bar. Creating a Sliding menu. Creating a
Remote Control. Creating a Clam Shell Menu. Creating a
Breadcrum Menu. Using the Link Tags.
24. Layout. the Layout Grid. Netscape
CSS Bug Fix. Setting the CSS for the OS. Letting the User
Pick the Layout. Setting a Dynamic Header and Footer.
Keeping Pages Framed. Open and Close Frames.
25. Controls. Creating Your Own
Scrollbars. Creating Your Own Back Button. Dragging
Objects. Pop-Up Hypertext. Contextual Forms.
26. Special Effects. Advanced Drop Shadow.
Fading HTML Text. Follow the Mouse. Animating Objects: the
Bouncing Banner. Toggling Graphics. Persistent Rollovers.
Transparent Graphics with the PNG format.
27. Multimedia. Using Sound. Creating a
Sound. Embedding Sound in a Web Page. Adding Sound to a
Link. Using Video. Linking to a Video. Embedding a Video.
Using Java Embedding Java Applets. Using Flash. Creating a
Flash animation. Embedding a Flash File.
28. When Things Go Wrong-Debugging Your Code.
Troubleshooting CSS.
Troubleshooting JavaScript. Crossbrowser Conundrums.
29. The Future of Dynamic Content. Why Standards Matter. XML.
XML and the DOM. XSL. XHTML. SMIL . Is Flash the Web's
Future? What's Next: CSS Level 3.
APPENDICES.
Appendix A: The Browsers. Netscape Navigator.
Internet Explorer. Other Browsers.
Appendix B: CSS Quick Reference. Appendix C: DHTML Quick Reference. JavaScript Reserved Words.
Object Flow. DHTML Objects.
Appendix D: Browser Safe Fonts. Apple Macintosh. Microsoft
Windows. Microsoft Internet Explorer.
Appendix E: Bugs and Fixes. CSS. DHTML.
Appendix F: Tools of the Trade. Appendix G: Further Research. webbedENVIRONMENTS.
Building the Web. Web Monkey. VisiBone