Introduction to DHTML


This page is an introduction to DHTML. Dynamic HTML was a marketing term used by the makers of the Netscape Navigator browser and the Internet Explorer browser, to describe the "new" technologies that these browsers in the 4.x generation would support. The tables below list the technologies compirising what was termed DHTML or Dynamic HTML at the time that the version 4.x browsers (NN and IE) were released.
 
Dynamic HTML is composed of a series of technologies which have helped to make Web pages interactive. The technologies comprising DHTML will be evolving. New technologies will be added from time to time. Fifteen years from now, of the technologies currently discussed in this article -- some will have become obsolete and new ones will have been added. Think of "dynamic" HTML as changing, evolving, improving over time as new technologies become available for Web developers and as more bandwidth becomes available to home users.
 
Previous problems with coding DHTML technologies have occurred because the browser manufacturers have created their own proprietary features and technology not supported by the other browsers nor standardized. This has resulted in Web pages that might look great when viewed with one browser, but look just horrible when viewed with another browser. Today, a Web author needs to check a Web page with more than one browser, and with several browsers if possible. Browser manufacturers need to adhere to the Industry standards without creating their own proprietary features and technologies. Developers are tired of having to deal with proprietary features or technologies that will only work in one brand of browser or the other. The "best" browser to buy will become the one without proprietary features or technologies but rather will consistently support each of the accepted and approved Industry standards for HTML, XHTML, XML, DHTML, CSS-2, and so forth. So far, such a browser does not exist. Each browser manufacturer continues to include proprietary features and technologies which might not be supported by another browser. Both major browsers support the concept of the document object model (DOM) using the window as the object. You can write javascript scripts addressing the document object model objects. For instance, to write something in the lower status bar, use a JavaScript script in the head section and code this line: window.status=""; and write your message between the quotes, then close the script.
~continued below~

 
back BACK to  Dynamic HTML Index Page
back RETURN to Advanced HTML and Style

 

DHTML is a set of initials representing Dynamic HTML, or Dynamic Hypertext Markup Language. It is pronounced just by saying the letters, d,h,t,m,l.  DHTML was originally a marketing term created by Microsoft and Netscape to refer to a suite of technologies supported by the fourth generation browsers, Netscape Navigator 4.x and Miscrosoft Internet Explorer 4.x. The technologies of DHTML , named in Table 1, enhance the "dynamic" capabilities of these two browsers.
 
With DHTML the web page designer controls how the various HTML elements are displayed and positioned in the window. The position of an element may be changed even after the document has loaded. Content can be made to appear and disappear as needed. The document can react and change -- even from actions initiated by the web page visitor, the end-user.

 
TIP:
The Amaya browser is a browser at the World Wide Web Corsortium (W3C.ORG) used to test and implement Web technologies. A free current version of the Amaya browser can be downloaded from w3c.org and installed on your own home computer.
 
Students: Students are not allowed to install anything or download anything onto a school computer. The Instructor who teaches a Web technologies class such as HTML, XML, etc. should ask the School's System Administrator to install the Amaya browser on classroom computers for class use.

 
See the HTML 4.0 links for additional information about the cross-browser technologies in HTML 4.0.
 
In the below tables, the green areas represent technologies supported in both Netscape Navigator version 4.x and newer as well as in the Internet Explorer versions 4.x and newer browsers.

 


 
      Table 1 - DHTML Technologies
AN OVERVIEW OF THE TECHNOLOGIES OF DHTML
IN NAVIGATOR AND EXPLORER 4.x
Colors: Lavender-Microsoft
Yellow-Netscape
Green-(both)
Netscape Navigator DHTML
 


Layers
 
JSS
 
 
 
Overlapping (Cross-Browser) DHTML Technologies

CSS
 
JavaScript
 
CSS-P
 
Microsoft Internet Explorer DHTML
 


Visual Filters
 
Dynamic CSS 
 
 
 

 
     Table 2 - Cross-Browser
CROSS-BROWSER TECHNOLOGIES OF DHTML
Name Description
(Cascading Style Sheets, Level-1; CSS-1)
 
(Cascading Style Sheets, Level-2; CSS-2)
CSS allows you to control how HTML elements will be displayed on the page.
CSS-P
(Cascading Style Sheets-Positioning)
"Positioning With Style Sheets"
CSS-P allows you to control element positioning in the window and to maintain or "hide" visibility of the element.
JavaScript JavaScript allows you to write simple scripting code to control HTML elements in the window.

 
     Table 3 - Netscape
NETSCAPE-SPECIFIC TECHNOLOGIES OF DHTML
Name Description
JSS
(JavaScript Style Sheets)
JSS uses a JavaScript syntax to define how various HTML elements will be displayed.
Layers Similar to CSS-P, layers allow you to control element positioning on the screen and to maintain or "hide" visibility of the element.

 
     Table 4 - Microsoft
MICROSOFT-SPECIFIC TECHNOLOGIES OF DHTML
Name Description
Dynamic CSS
(Dynamic Cascading Style Sheets)
Dynamic CSS allows you to change the positioning of the elements of a page as well as the appearance of the element.
Visual Filters Similar to PhotoShop filters, Visual Filters allow you to apply visual effects to text and graphics on the page. (Only supported by IE)


 

back to DHTML Index pageBACK to Dynamic HTML Index Page


 

 

 
Contact
 
Updated 27 March 2006
© hitmill.com
All Rights Reserved.
 
Article and tables by Cheryl Gribble for hitmill.com

 
image created in Adobe Illustrator;© by C. Gribble 2006;All Rights Reserved