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

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
TABLE OF CONTENTS:
  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
SEARCH DEVARTICLES

Sample Chapter: HTML 4.01 Programmers Reference
(Page 4 of 10 )

The <object> element supports the following attributes:
  • archive
  • border
  • classid
  • codebase
  • codetype
  • data
  • declare
  • height
  • width
  • hspace
  • vspace
  • name
  • standby
  • tabindex
  • usemap
plus the usual HTML 4.01 attributes id, class, style, dir, lang, and title, and the common events (see Chapter 2 for more details on these).

archive
This attribute specifies a list of space-separated URLs, which have information relevant to the resource specified in classid and data attributes. The syntax is:

archive="urllist"

border
This attribute specifies the width of the border to be drawn around the object. The syntax is:

border="n"

classid
This specifies a class identifier for an object (on Windows platforms, this information is stored in the registry on the user's machine, once the object has been installed). The syntax is:

classid="class_identifier"

The class_identifier is the information used to create an object on our web page. The class identifier (the HTML 4.01 standard specifies that this should be a URL) tells the browser to draw an object of a specified type. However, in Internet Explorer it's treated slightly differently; the classid attribute is the key to the whole element this is a value that is unique for every instance of the object, and this is how the browser knows which object to load into the page. Here's an example of the classid for the RDS control.

<object id= "RDS Control"classid= "clsid:BD96C556-65A3-11D0-983A-00C04FC29E33">...

It is used as an alternative to the data attribute, and is often preferred in Internet Explorer to data, where it doesn't seem to work as well for the <object> element.

codebase
This allows us to specify the URL location and version of the object to be used. The syntax is:

codebase="url"

However, it's only IE that really implements this attribute, and it implements it in the following way:

codebase="url#Version=a,b,c,d"

Most components need to be installed on our system before we can use them in our web pages. In IE, the codebase attribute points to a location from where the object can be downloaded and installed on our system for use. It also identifies the version of the file that should be downloaded. If an object isn't available already on our local machine then the system will have to go to the url specified. Of course, if the site specified in the codebase is busy or out of action, then unfortunately our page won't download and insert the requisite object correctly.

As we can see from the syntax, we can optionally append the URL with a version number string. The string has the following format:
  • a High-order word of the major version of the component available at the specified URL.
  • b Low-order word of the major version of the component available at the specified URL.
  • c High-order word of the minor version of the component available at the specified URL.
  • d Low-order word of the minor version of the component available at the specified URL.
If a, b, c and, d are all set to 1 then the component is only downloaded if the release date is later than the installation date on the user's machine.

An example codebase to enable us to run a Macromedia Flash 5 animation looks like this:

CODEBASE= "http://download.macromedia.com/pub/shockwave/ cabs/flash/swflash.cab#version=5,0,0,0"

However, this will only work with IE.

codetype
This specifies the Internet Media Type expected by the browser when downloading an object of the type that has been referenced in the classid attribute. It is only relevant if a classid attribute has already been specified. The syntax is as follows:

codetype="media_type"

Browsers may use the value of the codetype attribute to skip over unsupported media types, without the need to download unnecessary objects. See "type" for more details on media types.

declare
This declares the object without instantiating it. The syntax is simply declare.

Use this when you are creating cross-references to objects that occur later in the document, or when you are using the object as a parameter within another object.

data
This defines the URL, or the data itself, that is the source for the object. The syntax is:

data="source"

where source can be a URL from which the data can be downloaded, or the data itself as a string of hexadecimal values. We'll look at an example of this later in the chapter.

height and width
These specify the height and width that an object is to be displayed at. The syntax is:

width="n"
height="n"


where n is the width or height in pixels. This can also be expressed as a percentage value, in which case, the value should be appended with a % symbol.

When using the <object> element to display images width and height are scaleable. That is, we can use them to specify the size of box that we want the image to fit into, and the browser will scale the image to suit, which is exactly the same as how the <img> element handles images. However, there is an exception to this rule, in that IE 5.5 puts the image in its original size into a frame, and this frame is scaled to the dimensions specified by the width/height. We'll see more on this in a minute.

Using width and height with the <object> element helps the page to load faster, because the browser can lay out the rest of the page, as it knows the dimensions of the object before loading it.

hspace and vspace
These attributes are used to control the white space around an object. The syntax is:

hspace="n"
vspace="n"


where n is a numerical value in pixels. Other elements next to, above, and below the image will be moved away by the specified number of pixels. These attributes are now deprecated with the HTML 4.01 standard.

name
This attribute provides a name to refer to the object by. The syntax is:

name="name"

where name is a unique name within the page. In HTML 4.01, this is equivalent to the id attribute, but is only required for form submission.

standby
This attribute specifies a text string that will be used while the object data is loading. The syntax is:

standby="text"

where text is a word, phrase or sentence that describes the object, or provides a meaningful description of the object, when displayed while it loads.

tabindex
This is the tab index for the object within the page. The syntax is:

tabindex="n"

where n is the position within the tabbing order of the page. By default, all elements in the page that can receive the input focus are part of the tabbing order, in the order they are defined in the HTML source. Each receives the focus in turn as the Tab key is pressed. By setting the value of tabindex to -1, the element is removed from the tabbing order. See Chapter 6, for more on tabindex and focus.

usemap
This attribute indicates that the object is an image map containing defined areas that are individual hyperlinks. The usemap attribute is used to specify the map file to use with this object. The standard allows for a complete URL to an external map file, but usually a reference #mapName to an inline mapElement is used. Also, note that this attribute only exists in Internet Explorer 6, and not earlier IE versions. There is more information on image maps in Chapter 5.
blog comments powered by Disqus
HTML ARTICLES

- 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 
Support 

Developer Shed Affiliates

 




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