Home arrow HTML arrow Page 9 - Sample Chapter: HTML 4.01 Programmers Reference

Sample Chapter: HTML 4.01 Programmers Reference

In this article we will look at a sample chapter from Wrox's HTML 4.01 Programmer's Reference book. This chapter focuses on the HTML object tag and shows a variety of advanced ways to use and manipulate it.

Author Info:
By: Mitchell Harper
Rating: 5 stars5 stars5 stars5 stars5 stars / 10
July 24, 2002
  1. · Sample Chapter: HTML 4.01 Programmers Reference
  2. · The Object Tag Explained
  3. · How the
  4. · Page 4
  5. · Internet Explorer
  6. · Using the
  7. · Hidden Image Elements
  8. · Inserting a Java Applet with the Object Element
  9. · Inserting a Flash Animation with the Object Element
  10. · Conclusion

print this article

Sample Chapter: HTML 4.01 Programmers Reference - Inserting a Flash Animation with the Object Element
(Page 9 of 10 )

As mentioned earlier in this chapter, the way to insert a Flash animation into our web page is with the <object> element. Normally with Flash, we'd use the publishing tool (accessed in Flash via the File | Publish menu) to create the HTML for us, and so we wouldn't have to get involved with actual coding, as the publishing tool does this all automatically for us. However there are times when we might want to manually place a Flash animation into our web pages.

It's also worth mentioning that the code created by the publishing tool uses <object> to insert the animation in Internet Explorer, and within the <object> element, there is an <embed> element to insert the animation so that the Netscape 4 and Opera browsers can run it as well. The Netscape 6 browser seems unable to execute it via the <object> element once again Microsoft .cab files are required to run the Flash tool within <object>, and so Netscape 6 relies on the <embed> element. Now let's look at an example.

We've borrowed a Flash file (savior.swf see the code download) courtesy of Friends of Ed (http://www.friendsofed.com), which allows us to play a simple arcade game. Once again the code that creates the embedded application is not important, just the method by which we are inserting it. Flash is now commonly included in the latest browsers, but to be on the safe side we've added a codebase attribute to point to the flash download screen.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=5,0,0,0" width="500" height="400">
<param name="movie" value="savior.swf">
<param name="quality" value="high"> <param name="bgcolor" value="#FFFFFF"> Flash animations not supported with "object"</object>

Assuming the savior.swf file is located in the same directory as the web page, which has the above information included, we should see the following in Internet Explorer:

To get this animation to work in Netscape and Opera, we need to enclose the following <embed> element code with the <object> element code:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=5,0,0,0" width=500 height=400>
<param name="movie" value="savior.swf">
<param name="quality" value="high">
<param name="bgcolor" value="#000000">
<embed src="savior.swf" quality="high" bgcolor="#000000" width=550 height="400" type="application/x-shockwave-flash" pluginspace="http://www.macromedia.com/shockwave/download/ index.cgi?P1_Prod_Version=ShockwaveFlash"> </embed></object>

The <embed> element is not even deprecated as it never formed part of any HTML standard, although IE, Netscape, and Opera all support it. The pluginspace attribute is equivalent to the IE codebase attribute. There is more on the <embed> element in Chapter 16. One last thing to notice is that we don't require the <comment> tag here, as IE will only embed one occurrence of the Flash animation here (as it is meant to), despite the fact that technically there are two specified, because it ignores what is inside an <object> element, as it should if it handles the tag itself.

Inserting an Excel Spreadsheet
It is also possible to insert simple items in Internet Explorer, such as spreadsheets and Word documents. We could use a tool such as FrontPage to do the basic work for us, but all FrontPage is actually doing is creating the requisite <object> element and inserting the necessary data as param attributes. The following code would insert a blank Excel spreadsheet into our web page.

<object classid="CLSID:0002E510-0000-0000-C000-000000000046"> <param name="DisplayTitleBar" value="false"></object>

This unfortunately won't produce anything on Netscape or Opera, as they don't support COM objects.

Including HTML in Another HTML Document
The HTML 4.01 standard also allows us to use the <object> element to "insert HTML documents into our web pages". Inserting web pages into web pages might seem like a pointless pastime, but there are two reasons why it might be very useful:
  • First, it acts as an alternative to the <iframe> element, which is good, given that <iframe> isn't officially part of the HTML 4.01 standard. However, there are problems with its use for this purpose. An <iframe> element can be targeted by a link or form, and can be focused and printed, while an <object> element doesn't support these features.
  • Secondly, it enables us to easily reuse a single section of code (either HTML or script) many times throughout a site, without having to reproduce the code in its entirety.
We can embed a document using the data attribute as follows:

<object data="embedded_document.htm"> Couldn't include document specified.</object>

However, there has been a security hole associated with this ability in IE 5.5. It allows the execution of arbitrary programs using object type="text/html" and parsing index.dat, by revealing the location of the temporary internet files folder, which could possibly lead to a hacker taking full control over user's computer. There is a patch available to rectify this. Details of this security issue can be found here, and details of the patch here. The patch basically stops this from working. It also doesn't work in Netscape. The only surefire browser to support this is Opera 5.x.

Microsoft also provides the ability to embed script code within HTML documents as Behaviors. Behaviors are platform-independent components that can be deployed on the Web. Formerly their predecessor (known as Scriptlets) used the <object> element to achieve this. However, this was very much an evolving technology, and it proved to be a flawed way of inserting them, so Behaviors are now embedded using style sheets instead. As a result this is very much a technology beyond the scope of this book and one we won't discuss any further.

In this chapter, we've introduced and explained how to add objects to our web pages. We gave a brief overview of the <object> element. We introduced the different attributes and showed how it could be used to add images to HTML documents, as well as objects such as videos and MP3 files. This is the method that is recommended by the HTML 4.01 standard, and the method that should be used, if possible.

We rounded off the chapter with an overview of how we can embed some of the most popular components within our web pages. However, we suggested that as Internet Explorer doesn't properly support the <object> element for images, it is unlikely to displace the <img> element in popular usage, but for all other types of media, it is very useful.
blog comments powered by Disqus

- Does HTML5 Need a Main Element?
- Revisiting the HTML5 vs. Native Debate
- HTML5: Not for Phone Apps?
- HTML5 or Native?
- Job Hunting? Freelancer.com Lists This Quart...
- HTML5 in the News
- Report: HTML5 Mobile Performance Lags
- The Top HTML5 Audio Players
- Top HTML5 Video Tutorials
- HTML5: Reasons to Learn and Use It
- More of the Top Tutorials for HTML5 Forms
- MobileAppWizard Releases HTML5 App Builder
- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2019 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials