SAMPLE: Using HTML Layout Content in Internet Explorer Versions 3.02 and 4.0 or Later

The sample in this article demonstrates how to present HTML Layout content in Internet Explorer 3.02, with equivalent approaches in Internet Explorer 4.0 or later.

Because there is an architecture change in Internet Explorer 4.0, Microsoft recommends that you use Dynamic HTML (DHTML) rather than the HTML Layout control to dynamically position HTML elements when you script for Internet Explorer 4.0 and later. The HTML Layout ActiveX control is developed with the single-threaded architecture, and Internet Explorer 4.0 or later uses apartment-threaded architecture. This discrepancy may lead to a compatibility problem and may cause unexpected behavior. For more information on developing an ActiveX control with Internet Explorer, see the following Microsoft Web site:

The following file is available for download from the Microsoft Download Center:
For additional information about how to download Microsoft Support files, click the following article number to view the article in the Microsoft Knowledge Base: Microsoft scanned this file for viruses. Microsoft used the most current virus-detection software that was available on the date that the file was posted. The file is stored on security-enhanced servers that help to prevent any unauthorized changes to the file. In Internet Explorer 4.0 or later, DHTML provides a way to dynamically position HTML elements. Before dynamic positioning was available as Cascading Style Sheets (CSS) style attributes, the HTML Layout ActiveX control was developed to allow Web authors to position elements by means of an HTML Layout file (.alx).

Internet Explorer 4.0 or later warns users about the HTML Layout control, depending on security settings. For additional information, please see the following article in the Microsoft Knowledge Base: For additional information, click the article number below to view the article in the Microsoft Knowledge Base: With minor modifications, your existing HTML Layout files can be used in both Internet Explorer versions 3.02 and 4.0 or later.

The content of an HTML Layout file is encapsulated by <DIV> tags. For example: You must make the following modifications to the layout file if you want to use it in Internet Explorer versions 3.02 and 4.0 or later:

1. Add an absolute position style attribute to each <OBJECT> tag that is contained within the <DIV> tags. For example:

   <OBJECT ...
   STYLE="position:absolute;...">
   ... parameters here ...
   </OBJECT>
   					

2. If you need to dynamically modify the z-index of elements, remove the z-index style attribute from each <OBJECT> tag. The sample file, Redblue.htm, provides an example of z-index behavior.
3. Add script to detect the browser version.
4. Add the following script to dynamically generate the correct HTML.
   
   Note Because the modified layout file contains valid DHTML, you can use an <IFRAME> tag to display the content in Internet Explorer 4.0 or later. Use an <OBJECT> tag to insert the HTML Layout control for Internet Explorer 3.02. See the sample file Alxport.htm for detailed information.
   
   In Internet Explorer 3.02, add the following script:

   document.write('<OBJECT');
   document.write(' CLASSID="CLSID:812AE312-8B8E-11CF-93C8-0AA00C08FDF"');
   document.write(' CODEBASE=');
   document.write(
   '"http://activex.microsoft.com/controls/mspert10.cab#version=1,0,5,1"');
   document.write(' ID="Html_Layout1" STYLE="LEFT:0;TOP:0">');
   document.write(' <PARAM NAME="ALXPATH" REF VALUE="RedBlue2.htm">');
   document.write('</OBJECT>');
   						

   In Internet Explorer 4.0 or later, add the following script:

   document.write('<IFRAME MARGINWIDTH=0 MARGINHEIGHT=0 FRAMEBORDER=0');
   document.write(' WIDTH=564 HEIGHT=254 SRC="RedBlue2.htm">');   
   					

5. Because CSS style attributes are available only with Internet Explorer 4.0 DHTML, use the object property if your browser is Internet Explorer 3.02.
   
   For example, to hide an HTML element in Internet Explorer 3.02:

   Label2.Visible = false;
   						

   In Internet Explorer 4.0 or later:

   Label2.style.display = "none";
   					

6. Add an onload event handler to the HTML layout file to perform any initialization.
   
   Note In Internet Explorer 3.02, an onload event is fired for the layout <DIV> tag and, with later scripting engine versions, for the window object. In Internet Explorer 4.0 or later, an onload event is fired for the window object. See the sample file Alxfile.htm for more detailed information.
   
   In Internet Explorer 3.02:

   <SCRIPT LANGUAGE="VBScript" FOR="Layout1" EVENT="OnLoad">
      // Handle HTML Layout control OnLoad event; this occurs for Internet Explorer 3.02
      StartupCode()
   </SCRIPT>
   						

   In Internet Explorer 4.0 or later:

   <SCRIPT LANGUAGE="VBScript" FOR="Window" EVENT="OnLoad">
      // Handle window OnLoad event; occurs for Internet Explorer versions 4.0
      // or later and 3.02 with later scripting engine versions.
      StartupCode()
   </SCRIPT>
   					

7. In Internet Explorer 4.0 or later, the onclick event is not fired for the Microsoft Forms 2.0 Image Control. Add an onclick event handler to a surrounding <DIV> tag to determine which image object was clicked. The sample file, Redblue.htm, demonstrates this. The HTML Layout control ignores any event handler in the <DIV> tag. This can be used to implement browser specific behavior.
8. Rename the HTML layout file from an .alx extension to an .htm extension so that users are not prompted to open or save the file when it is included as the source of an <IFRAME> tag in Internet Explorer 4.0 or later.

For more information, see the MSDN Online Web Workshop: For additional information%1, click the article number%2 below to view the article%2 in the Microsoft Knowledge Base: