spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / dhtml / column12
Developer News
Metasploit 3.2 Offers More 'Evil Deeds'
'Thank You Apple. Seriously.'
The Buzz: BlackBerry App Store Seen Next
Logo

Expandable Outlines
creating expandable/collapsable outlines in both browsers


This tutorial can be appreciated by users of any browser, any version. The in-line examples will work only in Netscape Navigator 4 or Internet Explorer 4, Release.
This technique was developed after a suggestion by Anders Lund.

Those of you who visit our links page regularly will be pleased to know that we've minimized the scrolling needed to browse the link list, by presenting the page in an expandable/collapsable outline format for DHTML browers.

In fact, the whole list is reproduced here. Click on the triangle images to expand and collapse the individual headings or even the complete list:

Non-DHTML Browsers: Jump to end of outline

Expand/Collapse All Display/Hide All

Expand/Collapse Item World Wide Web Consortium (W3C)

Standards

HTML 4.0 Proposed Recommendation   New! - Important!!
http://www.w3.org/TR/PR-html40
The Biggie! Already implemented in part by 4th generation browsers, HTML 4.0 ties up the loose ends created by the browser wars, and sets the standard for the fifth browser generation.

HTML 3.2 Recommendation
http://www.w3.org/pub/WWW/TR/REC-html32.html

Cascading Style Sheets, level 1 (CSS1)
http://www.w3.org/pub/WWW/TR/PR-CSS1

Soon-to-be Standards

The Document Object Model   New!
http://www.w3.org/TR/WD-DOM/
By far the most important pending recommendation for Dynamic HTML. At last being publicly discussed and developed.

Cascading Style Sheets, level 2 (CSS2)   N e w!
http://www.w3.org/TR/WD-CSS2/
The future style sheet standard. Many features are already implemented in DHTML browsers. Expands on CSS1 and includes the following separately-developed working drafts:

Extensible Markup Language (XML): Part1. Syntax
http://www.w3.org/TR/WD-xml-lang
Do-it-yourself mark up. Then what will the W3C do?

Expand/Collapse Item Netscape

Dynamic HTML documentation   Updated!
http://developer.netscape.com/library/documentation/communicator/dynhtml/index.htm
Recently updated for Communicator final release with better CSS documentation and examples. An invaluable reference for developers, the complete documentation can be viewed online, or downloaded as:

Expand/Collapse Item Microsoft

Dynamic HTML documentation
http://www.microsoft.com/sitebuilder/workshop/author/dhtml/
a.k.a Anything you can do, I can do better.

Internet Client SDK   Invaluable!
http://www.microsoft.com/msdn/sdk/inetsdk/help/
The Complete Reference for Internet Explorer. Dynamic HTML section superior to Microsoft's own DHTML docs, above.

Microsoft - Final Release Notes   New!
http://www.microsoft.com/workshop/prog/ie4/new/

If you have a low-resolution monitor or just plain want to break out of Microsoft's ridiculous multi-framed navigation, go directly to...

Expand/Collapse Item Scripting

JavaScript, The Complete Reference   Updated! - Must Have!!
http://developer.netscape.com/library/documentation/communicator/jsref/index.htm
Finally available, the comprehensive documentation for JavaScript, both client and server. Includes the JavaScript 1.2 addendum. The new JavaScript Bible. Can be viewed online, or downloaded as:

JavaScript Guide   New!
http://developer.netscape.com/library/documentation/communicator/jsguide4/index.htm
Describes the core JavaScript language, including JavaScript 1.2 features. Serves as a quick reference to JavaScript structure. Full description of properties and methods, however, only in The JavaScript Reference. Can be viewed online, or downloaded as:

JavaScript 1.2 Addendum   Updated!
http://developer.netscape.com/library/documentation/communicator/jsguide/js1_2.htm
Puts the Dynamic in Netscape's Dynamic HTML. Now also available as part of The JavaScript Reference. Can be viewed online, or downloaded as:

ECMAscript
http://www.ecma.ch/STAND/Ecma-262.htm
The new international web scripting language standard based on JavaScript 1.1, recently ratified by ECMA, now available for downloading, in
self-expanding MS WORD or Acrobat PDF format.
You read it here first: ECMA stands for European Computer Manufacturers Association

Microsoft Scripting   New!
http://www.microsoft.com/scripting/
Microsoft's new home page for all its scripting docs, articles and links.

JScript   Updated!
http://www.microsoft.com/jscript/
Complete Reference for JScript 3 for IE4.

VBScript
http://www.microsoft.com/vbscript/
The 8-track tape of scripting.

Expand/Collapse Item PNG (Portable Network Graphics) Image Format

W3C PNG Recommendation
http://www.w3.org/pub/WWW/TR/REC-png.html

The Official PNG Home Page
http://www.wco.com/~png/png.html

Plug-in for Netscape Navigator
http://codelab.siegelgale.com/solutions/png_index.html

Expand/Collapse Item Implementation Issues (bugs or limitations)

Netscape JavaScript Bugs   Updated for Communicator!
http://developer.netscape.com/library/javascript/faqs/buglist/js-known-bugs.html

Communicator CSS1 Known Issues
http://developer.netscape.com/support/bugs/known/css.html

Expand/Collapse Item Further Reading

There's no place like home

Doc JavaScript
http://www.webreference.com/js/
Bi-weekly prescriptions for all your JavaScript ailments.

Cascading Style Sheets
http://www.webreference.com/dev/style/
An Introduction to CSS

Style Sheet Syntax
http://www.webreference.com/dev/style/syntax.html
Excert from the upcoming book HTML Web Publishing SECRETS from IDG Books

Cascading Style Sheets: Designing for the Web
http://www.webreference.com/content/css/
Excerpts and a full chapter from the book by Hakon Lee and Bert Bos of the W3C.

The Evolution of Style Sheets
http://www.webreference.com/dev/style/evolution.html
A history of CSS and future directions.

Other Developer Sites

IE Help   New!
http://www.iehelp.com/
Compuserve's new Explorer-related megasite.

Netscape Help   New!
http://www.netscapehelp.com/
Compuserve's new Netscape-related megasite.

BrowserWars.com   New!
http://www.browserwars.com/
Compuserve's new megasite devoted solely to coverage of browser development.

DHTML Dude   New!
http://www.microsoft.com/sitebuilder/columnists/default.asp
Microsoft's own regular DHTML column with a name I wish I had thought of.

Builder.com
http://www.builder.com/
C|NET's site for web developers. Regular SuperScripter column, and longer in-depth occasional articles.

Inside DHTML
http://www.insidedhtml.com/
Scott Isaacs' comprehensive source of Dynamic HTML information and techniques. Focus on IE4. MSIE4 absolute must!

Dynamic HTML Zone
http://www.dhtmlzone.com/
Macromedia's ambitious new Dynamic HTML mega-site with articles, tutorials, and discussion group.

Web Review
http://www.webreview.com/
Regular Dynamic HTML articles, particularly in bi-weekly Web Coder column by Nick Heinle of WebReference's JavaScript Tip of the Week

WebCoder
http://webcoder.com/
Nick Heinle's all-encompassing site on DHTML and JavaScript.

NetscapeWorld
http://www.netscapeworld.com/
Monthly articles, strong in JavaScript, some DHTML. Undergoing major re-construction. Stay tuned.

WebMonkey
http://www.webmonkey.com/
Regular coding columns, but their Wired layout needs deciphering.

Expand/Collapse All Display/Hide All

Admittedly, this technique is becoming popular with IE4-specific pages. We, too, will discuss the Explorer methods in detail, but we'll move a step further to create a Navigator version, and finally a cross-browser version of expandable outlines.

In This Column

We will discuss:

Along the way, we'll explore for the first time:

We start with an overview of the display property.


Produced by Peter Belesis and



JupiterOnlineMedia

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info


Legal Notices, Licensing, Reprints, & Permissions, Privacy Policy.

Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

Solutions
Whitepapers and eBooks
IBM Whitepaper: Innovative Collaboration to Advance Your Business
Internet.com eBook: Real Life Rails
Avaya Article: Call Control XML - Powerful, Standards-Based Call Control
Tripwire Whitepaper: Seven Practical Steps to Mitigate Virtualization Security Risks
Internet.com eBook: The Pros and Cons of Outsourcing
Go Parallel Article: Scalable Parallelism with Intel(R) Threading Building Blocks
Internet.com eBook: Best Practices for Developing a Web Site
IBM CXO Whitepaper: The 2008 Global CEO Study "The Enterprise of the Future"
Avaya Article: Call Control XML in Action - A CCXML Auto Attendant
Go Parallel Article: James Reinders on the Intel Parallel Studio Beta Program
IBM CXO Whitepaper: Unlocking the DNA of the Adaptable Workforce--The Global Human Capital Study 2008
Adobe Acrobat Connect Pro: Web Conferencing and eLearning Whitepapers
Go Parallel Article: Getting Started with TBB on Windows
HP eBook: Storage Networking , Part 1
MORE WHITEPAPERS, EBOOKS, AND ARTICLES
Webcasts
Go Parallel Video: Intel(R) Threading Building Blocks: A New Method for Threading in C++
HP Video: Is Your Data Center Ready for a Real World Disaster?
Microsoft Partner Portal Video: Microsoft Gold Certified Partners Build Successful Practices
HP On Demand Webcast: Virtualization in Action
Go Parallel Video: Performance and Threading Tools for Game Developers
Rackspace Hosting Center: Customer Videos
Intel vPro Developer Virtual Bootcamp
HP Disaster-Proof Solutions eSeminar
HP On Demand Webcast: Discover the Benefits of Virtualization
MORE WEBCASTS, PODCASTS, AND VIDEOS
Downloads and eKits
Microsoft Download: Silverlight 2 Software Development Kit Beta 2
30-Day Trial: SPAMfighter Exchange Module
Red Gate Download: SQL Toolbelt
Iron Speed Designer Application Generator
Microsoft Download: Silverlight 2 Beta 2 Runtime
MORE DOWNLOADS, EKITS, AND FREE TRIALS
Tutorials and Demos
IBM IT Innovation Article: Green Servers Provide a Competitive Advantage
Microsoft Article: Expression Web 2 for PHP Developers--Simplify Your PHP Applications
Featured Algorithm: Intel Threading Building Blocks - parallel_reduce
MORE TUTORIALS, DEMOS AND STEP-BY-STEP GUIDES
webref The latest from WebReference.com Browse >
Popular JavaScript Framework Libraries: An Overview · Controllers: Programming Application Logic - Part 2 · How to Use JavaScript to Validate Form Data
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Choosing the Right Online Backup Provider · Mother Avaya Nurtures Her Technology Partners · Software as a Service a Winning Model for Hotspot Provider

All Rights Reserved. Legal Notices.
Created: Jan. 14, 1998
Revised: Jan. 18, 1998

URL: http://www.webreference.com/dhtml/column12/