![]() |
![]() |
Web Integration > Publishing windowless content > Windowless content in different browsers
Windowless content in different browsers
These sample codes all display an AXEL stream file on screen on top of another content. The first sample shows how to make it functional in Internet Explorer 4+, the second in Netscape Navigator 4+ and the third in both browsers via JavaScript.
First Sample Code - IE 4+
<object id="AXELStreamFile" classid="CLSID:68A2C3BD-7809-11D3-8ACF-0050046F2F9A" codebase="http://www.mindavenue.com/Downloads/
Second Sample Code - NN4+
<layer id="LayerName" position="absolute" left="258" top="146" width="297" height="203" z-index="2">
<object id="AXELStreamFile" classid="CLSID:68A2C3BD-7809-11D3-8ACF-0050046F2F9A" codebase="http://www.mindavenue.com/Downloads/
Third Sample Code - IE4+ AND NN4+ (via JavaScript)
<object id="AXELStreamFile" classid="CLSID:68A2C3BD-7809-11D3-8ACF-0050046F2F9A" codebase="http://www.mindavenue.com/Downloads/
We will now extract the important parts of this last sample code for a better understanding of their purpose.
This is a basic test to detect which browser is used to view the current HTML page. A quick way to do so is to check if a specific document tag is being read (meaning a browser will understand it). The boolean result of these detections are stored into variables that will be used in the next section.
In order to show the AXEL stream file on top of another content, we have to use the concept of layers used in DHTML. Both 4th generation (and up) Internet Explorer/Netscape browsers support layers but each uses different tags. Internet Explorer understands <div></div> while Netscape works with <layer></layer>. Therefore, before writing the actual AXEL stream file content, we must include the two tag alternatives and let the browser choose the one it understands. Notice the <div> statement in the above code has less attributes than the <layer> statement. We will explain why in the following section.
<object id="AXELStreamFile" classid="CLSID:68A2C3BD-7809-11D3-8ACF-0050046F2F9A" codebase="http://www.mindavenue.com/Downloads/
This is the typical HTML code to include an AXEL stream file into an HTML page similar to the one we get when we publish from the AXEL author software. Internet Explorer goes straight for the first part, the <object> tag, while Netscape skips further down to the <embed> tag. Even if they look different at first glance, they both contain the same information with a few exceptions. For example, the positioning attributes that were missing in the <div> statement in the previous section now appear in the first part of the code as a style sheet. Positioning attributes are not needed in the <embed> tag because we already declared them as attributes in the <layer> tag.
You can also control AXEL content position using attributes in the <div> tag. The behavior is a little different. If you want to click on a hyperlink underneath your windowless AXEL content, you'll have to place them in the same <div></div> section and use the style sheet to place the AXEL content over the hyperlink. IE supports "click through" transparent windowless AXEL content. However, this feature is not supported in Netscape.
It is important that the windowless parameter is set to "1" and "true" respectively in <object> and <embed> tags. It is also important that the value of the ID attribute in <object> tag is the same as the value of the name attribute <embed> name (it doesn't affect the windowless display but is used to control the AXEL stream file via JavaScript).
This last script is similar to the one choosing between the two layer tags but it differs from the fact that this time, we close the chosen tag after the appropriate detection has been made, as seen before.
No matter which script you choose, you might want to double-check your code to make sure that your syntax and tags are well-spelled and correctly in place or else there might be unexpected results such as AXEL stream files being greatly displaced upon a resize of the browser window or visually duplicated on screen or, on the contrary, visually removed from your browser.
For more information on the browser plugins that give the best results, refer to the FAQs on the MindAvenue Resources Support page.
![]() |
![]() |