All Categories :
ActiveX
Chapter 1
Getting to Grips with ActiveX
CONTENTS
The combination of ActiveX and VBScript makes your Web pages more
appealing and easier to use-features that are vitally important
in a Web where thousands, even millions, of Web sites are competing
for attention. ActiveX and VBScript bring your Web pages to life;
you will soon see how quickly and easily you can create interactive,
intercreative Web pages that Web users will want to visit and
return to visit again.
ActiveX is the technology that will eventually bring together
the Internet or World Wide Web and the desktop-whether it's Windows
or Macintosh-as one seamless environment. One of the most exciting
aspects of using ActiveX and VBScript to enhance your Web pages
is that you help further the development of the Web in a direction
that was merely a pipe dream only months ago.
You might be surprised and even a little disappointed to learn
that ActiveX controls are actually nothing new. Windows as we
know it would not exist but for ActiveX controls, or as they used
to be known, OCX controls. Although ActiveX controls are somewhat
less bulky, they are really the same as OCX controls, which gives
you a huge advantage when using ActiveX. Years of usage and development
went into the underlying OLE (Object Linking and Embedding) technology.
This chapter gives you some of the basic knowledge that you need
to get started using ActiveX controls: how you add them to the
page and how you can customize them to suit your needs. You'll
also take your first look at the tool du jour, the ActiveX
Control Pad, which makes the job of interfacing ActiveX controls
quicker and easier.
The ActiveX Control Pad and HTML Layout control that come together
as a complete package are freely available for download from Microsoft's
Site Builder Workshop Web site at http://www.microsoft.com/workshop/
(see Figure 1.1). Simply follow the links to the ActiveX Control
Pad download area. At the time of writing, Microsoft requires
you to complete a very straightforward registration form prior
to downloading the ActiveX Control Pad.
Figure 1.1 : The Microsoft Site Builder Workshop.
To install and use the ActiveX Control Pad, you must first have
Microsoft Internet Explorer 3.0 installed on your machine. Additionally,
your system must have the following minimum specification:
- PC 80486 or above
- Windows 95 or Windows NT 4.0
- 12MB RAM
- 10MB free hard disk space
- Microsoft Internet Explorer 3.0
The ActiveX Control Pad and HTML Layout Control are very easy
to install. The single file containing them both is a self-extracting,
self-installing archive. To set up the Control Pad, all you have
to do is locate the file you downloaded (setuppad.exe)
and double-click it to extract the contents and commence the installation
procedure, as shown in Figure 1.2.
Figure 1.2 : During the Control Pad installation, you
can accept the default directory or enter your own.
The installation creates a program group called Microsoft ActiveX
Control Pad that you can access from the Windows 95 Start
button. As with all software you install, the first thing you
should do is read the readme, but you always do that
anyway-don't you?
The ActiveX Control Pad is an HTML authoring tool with a difference.
It enables you to add active controls and active scripting to
your HTML pages. When I say active controls, I don't mean only
ActiveX controls; you can embed Java applets, too. Active scripting
doesn't mean only VBScript; JavaScript and Microsoft's implementation
of JavaScript, known as JScript, are also supported. You can add
controls quickly and easily using the familiar Windows point and
click method.
ActiveX controls can be as simple as the buttons or drop-down
lists you regularly find in Windows programs, or they can be complete
stand-alone programs, somewhat like a Java applet.
You'll learn more about the theory of ActiveX controls in Chapter
21. But for now, create a simple active-content HTML page using
one of the preloaded ActiveX controls.
Open the ActiveX Control Pad as you would any other Windows application
by double-clicking the icon in the ActiveX Control Pad program
group. Figure 1.3 displays the ActiveX Control Pad as it appears
when you first open it. You'll notice that it automatically creates
a new HTML page, complete with a simple HTML template, ready for
you to start creating your active-content Web page.
Figure 1.3 : The ActiveX Control Pad showing the automatic
HTML template.
NOTE |
In this book, I assume that you're already up to speed with HTML, so unless there are any new HTML tags or tags specifically designed to handle active objects, I won't waste your time detailing the HTML. If you need an HTML refresher or primer, you can consult Appendix A, "HTML Reference/MSIE Extensions." As a bonus, the book Teach Yourself Web Publishing with HTML 3.2 in 14 Days, Professional Reference Edition by Laura Lemay is included on this book's CD-ROM.
|
Take a look around the ActiveX Control Pad window. You have a
text editor but no WYSIWYG screen. WYSIWYG editing and control
placement are the jobs of the HTML Layout Control, which I examine
in detail in Chapter 14, "Using the HTML Layout Control."
The goal of using the ActiveX Control Pad is to place code that
implements ActiveX and Java controls and any associated scripts
in your HTML Web pages with a minimum of fuss and trouble and
even without any programming skills. The ActiveX Control Pad is
where you start to build or edit your active-content HTML pages.
To try the text editor and start getting a feel for the environment,
enter some simple HTML into the document.
- Give the page a title, My First ActiveX Web Page.
- Add a BGCOLOR="white" attribute to the
<BODY> tag.
- Add <CENTER> and </CENTER> tags
below the <BODY> tag.
- Now, between the <CENTER> tags, add a main
<H1> heading, Welcome to my Active Web.
- Save the document as welcome.htm in the directory
of your choice.
By default, the Control Pad saves all work in the Program
Files\ActiveX Control Pad\ subdirectory. In the Control Pad,
the saved HTML page should look like the one in Figure 1.4.
Figure 1.4 : welcome.htm in the HTML text editor of the
Control Pad.
After you save the page, run it with the Internet Explorer either
by opening the Internet Explorer and opening the page from the
File|Open menu option or by clicking the filename that is now
available in the recent Documents menu attached to the Start button-assuming
you set Internet Explorer as your default browser. The page should
look like the one in Figure 1.5.
Figure 1.5 : welcome.htm in the Internet Explorer.
Now that you're satisfied that the ActiveX Control Pad can create
normal flat HTML Web pages, your next step is the one you've been
waiting for: adding some active content. Return to the ActiveX
Control Pad, and if you've closed it in the meantime, reopen welcome.htm.
TIP |
You can invoke the ActiveX Control Pad and open an HTML document in it by right-clicking the HTML document's icon in Windows Explorer and selecting Edit in ActiveX Control Pad from the pop-up menu.
|
Insert an empty line after the </H1> tag. Enter
a <P> paragraph tag to add some space under the
heading and press Return, making sure your cursor appears at the
beginning of this blank line.
To insert an object, select Insert ActiveX Control from the Edit
menu. The Control Pad displays a dialog box similar to Figure
1.6, which contains all the insertable ActiveX controls registered
on your system.
Figure 1.6 : The Insert ActiveX Control dialog box, scrolled
to show the MS Forms 2.0 controls.
You should at least see a number of Microsoft Forms 2.0 controls
listed in the ActiveX Control dialog box; however, the number
and type of controls available to you depends upon the software
you previously loaded on your computer.
NOTE |
If you installed Microsoft Visual Basic 4.0, you'll see a large variety and number of controls, most of which will be immediately familiar to you, confirming that the OCX custom controls used in development environments such as Visual Basic are in fact ActiveX controls and can be used as such. In Chapter 21, you construct a Web page using one of the Visual Basic custom controls.
|
Take a moment to scroll through the list of controls. Find the
control named Microsoft Forms 2.0 Label, select it so that it
is highlighted, and click OK. Figure 1.7 shows what you should
see next.
Figure 1.7 : The ActiveX Object Editor and Properties
window.
The small window on the left is the Object Editor (see Figure
1.8). This is NWYSIWYG, Nearly-What-You-See-Is-What-You-Get.
The object you selected in this window is shown as it will appear
on the HTML Web page but not in the place where it will appear.
The placement is still determined by its order within the HTML
source document. However, you can use the mouse to change its
size and other properties, as you'll see shortly.
Figure 1.8 : The ActiveX Object Editor.
The larger window to the right is the Properties window (see Figure
1.9). Here, you can see a long list of attributes that this label
possesses. Take a moment to scroll down the list of properties.
Some are self-explanatory; others are somewhat more obtuse. All
the property values listed here are the default values for this
particular control. You change a property by selecting the particular
property value next to the property name.
Figure 1.9 : The ActiveX Properties window.
Some of the controls you'll use are just fine with their default
property values, but most of the time, you'll want to customize
the control in some way to suit your purposes. After all, customization
is one of the really neat things about Windows controls. You can
see from the list of properties that not only can you change the
outward appearance of a control, but you can also change how the
control operates. You can make the changes quickly and easily
even if you haven't written a program in your life. Here's how
you set an object's properties:
- Put your mouse cursor over the value for AutoSize
and click to select it. The default value should be 0- False.
Immediately, several things happen: The property value appears
in the drop-down list, which becomes enabled at the top of the
Properties window, and the Apply button becomes enabled.
- Click the down arrow next to the drop-down list.
You see the choices available for this property. AutoSize
is quite straightforward; you choose either -1 - True
(the label automatically changes its width to fit the caption
it contains) or 0 - False (the label always remains the
same width regardless of the caption width).
- Select -1 -True.
The label automatically reduces in width. It's really as simple
as that; some of the properties have many different values you
can choose, and some rely entirely on your input, but customizing
each object is very straightforward.
To save the current property values and return to the HTML page,
simply close the Object Editor window. The relevant HTML code
for this object and its parameters are then transcribed automatically
onto the HTML document in the Text Editor window (see Figure 1.10).
Figure 1.10: The control's HTML definition is automatically
placed in the text editor.
All the code that defines and implements an ActiveX control is
added for you, including the horrendous-looking CLASSID
that uniquely identifies each type of control. You can now see
just how easy it is to add ActiveX controls to your Web pages.
At this point, you'll probably get a rush of adrenaline and want
to start adding all types of controls all over your pages-so don't
let me stop you. Here's how to do it:
- Place your cursor at the end of the </OBJECT>
line and enter another <P> paragraph tag; then
press Enter again.
This time, you add a command button to the page.
- Select Insert ActiveX Control from the Edit menu, and select
the Microsoft Forms 2.0 Command Button object.
- Open the Object Editor and the Properties window by clicking
OK. In the Properties window, select the Caption property,
which determines the message on the face of the button. Click
in the box at the top of the Properties window next to the button
marked Apply, and type Click; then click the Apply button.
Your new property value appears in the property list and displays
on the command button itself in the Object Editor window.
You can also change properties by using the Object Editor. Click
the button that you created in the Object Editor window. A hatched
marquee containing eight small, white drag blocks appears around
the button. You can use the drag blocks at the corners of the
button to increase or reduce the size and width in the same operation.
You can use the blocks at north, east, south, and west to drag
the button's height and width independently of each other.
Click in the center of the button. This gives you a flashing cursor,
and you can see that the text on the button face has the focus.
Using your arrow keys, move the cursor to the end of the word
Click, press the space bar, and type Me. Notice that
the change is echoed in the Properties window. Editing properties
is that simple. To save the current properties and return to the
Text Editor, close the Object Editor window. Your HTML page should
now look like the one in Figure 1.11.
Figure 1.11: The command button definition added to
the HTML page.
Save the file with the Save icon or choose Save from the File
menu, and run the page with your Internet Explorer browser. It
should look like the page in Figure 1.12. If your browser is loaded
with the page from earlier in the chapter, simply click Refresh
to see the amended Web page.
Figure 1.12: The page with an HTML caption, an ActiveX
label, and an ActiveX command button.
Now you have two ActiveX controls on your page: a label and a
command button. You probably think your ActiveX Label control
looks far from appealing, more like a mistake than state-of-the-art
active content! You can do something about that.
Return to the ActiveX Control Pad with your welcome.htm
page open. Look down the left margin of the text editor. You see
(and probably saw before) two blue cube icons. As you might guess,
these icons represent the ActiveX objects you placed on your page.
Click the cube icon next to your label control. Voila! The Object
Editor and Properties window open, ready for editing.
Now you can do something about this label. By default, the label's
background color was set to the same color as a standard Windows
button-gray. So follow these steps to change the label's background
color to white so that the label blends into the page:
- Click the BackColor property in the Properties window.
At the top of the Properties window, you see two controls next
to the Apply button. The standard drop-down list contains all
the standard Windows colors you can choose, and a new control
displays three dots, known as an ellipsis.
NOTE |
The ellipsis button displays whenever you select a property that can be set using a separate dialog box for sample color or font.
|
- Click the ellipsis button to the right of the list, which
invokes the Windows color palette shown in Figure 1.13.
Figure 1.13: The ActiveX color palette.
You can choose one of 48 basic colors or create any custom color
you want for the background of your label. This color palette
is available for most color properties. For this exercise, set
the background to white:
- Click the white color box (bottom-right corner of the basic
palette).
- Click OK.
The BackColor property shows the hexadecimal value for
white, and the label in the Object Editor displays white. Because
the background of the HTML page is also set to white, the user
will see only the text that is on the label; the rest of the
label will blend into the background.
The main property of a label is its caption-the words that the
outside world sees displayed on the page. It's about time you
gave your label a meaningful caption:
- Simply place your cursor over the Caption property
and click.
- Enter the words Active Content in the box at the
top of the Properties window.
- Click Apply.
If your label has all the right default settings, it might not
look quite as you anticipated because labels are by default set
to wrap words. This means that characters that do not fit within
the width of the label are forced onto a new line; as a result,
the words appear down rather than across the label. Change the
WordWrap property as follows:
- Scroll down to the bottom of the property list until you find
WordWrap.
- Change WordWrap to False.
NOTE |
In effect, when you set the label's WordWrap property to True, the width of the label is fixed, and the height is variable. When you set WordWrap to False, the width of the label changes to accommodate the caption in one unbroken line, and the height is fixed.
|
The label should now have its correct proportions, but it's still
somewhat small. You should increase the size of the font as follows:
- Find the Font property and give it a click. The ellipsis
button appears so that you can choose settings from a specialized
dialog box.
- Click the ellipsis button to see a complete font selection
dialog, as shown in Figure 1.14.
Figure 1.14: The ActiveX font selection dialog box.
As you can see, you can choose from all the fonts installed on
your system, along with all their corresponding styles and sizes.
NOTE |
Remember that not everyone has the same fonts that you have on your system. You can create a Web page with the very latest and greatest fonts that look stunning on your computer, but when a user with a standard set of fonts downloads the Web page with his browser, it might look very different indeed. It's therefore wise to stick to the main system fonts.
|
- Select a font size of 24 points.
- Click OK.
The label caption and the label itself should change size. If
the label didn't grow to accommodate the new larger text, make
sure that the AutoSize property is True.
Close the Object Editor or Properties window to save the properties
you just amended. Save the page and look at it in Internet Explorer.
You see your first ActiveX welcome page as shown in Figure 1.15.
Figure 1.15: Your ActiveX Welcome Web page.
Impressed? You've just created your welcome page; it is rather
straightforward, but it's ActiveX without the active. To
give the page some interactivity, you need to provide some instructions
to the controls, which is where VBScript comes in. In the next
section, you'll find out how to use VBScript to quickly and easily
interface ActiveX controls on your Web pages.
Active scripting refers to the technology of adding to your Web
pages a script or program that interfaces with the active controls.
Scripts download within the HTML page as ASCII text so that they
are safe, meaning that a rogue programmer cannot write a hidden
virus or other mischievous program within the script. Internet
Explorer supports any scripting language that is written to the
ActiveX scripting specification.
This book concentrates on VBScript, which has the full title Visual
Basic Scripting Edition. Adding VBScript procedures via the ActiveX
Control Pad is as easy as other point-and-click operations because
of the Script Wizard. By default, the built-in Script Wizard generates
VBScript code; however, it also has the capability to generate
JavaScript (or JScript, as Microsoft now calls its implementation).
VBScript is a subset of Visual Basic for Applications (VBA). To
ensure the safety of Web pages downloaded across the Internet,
VBScript leaves out several major features of VBA that deal mainly
with functions and procedures that interface with the hard drive
and the underlying operating system. You can implement VBScript
only to function within the context of the browser.
With VBScript in particular and active scripting in general, you
can access a control's properties, methods (things a control can
do), and events (things done to it), making the controls truly
active. Above all, you can achieve very professional results in
very little time with little or no programming knowledge. Of course,
the deeper you get into using active controls and active scripting,
the more you need to know about the workings and implementation
of controls and scripting. In later chapters, you will learn how
to produce complex programs with VBScript.
Add some life to the welcome page you created in the last section.
First, open the welcome.htm page in the ActiveX Control
Pad. You can open the Script Wizard in one of three ways:
- Select the Script Wizard menu option from the Tools menu (Tools|Script
Wizard).
- Right-click anywhere in the Text Editor and select Script
Wizard from the pop-up menu.
- Click the Script Wizard toolbar button (which looks like an
ancient scroll).
The Script Wizard dialog box, shown in Figure 1.16, contains the
ActiveX objects you placed in the HTML page earlier.
Figure 1.16: The ActiveX Script Wizard.
The Script Wizard has three main components. The left pane of
the dialog box is the Events window. If you click one of the plus
signs next to an object, a list of the events for the object expands
under it. The diamonds to the left of the event names denote whether
a script was attached to the event (black diamond) or not (white
diamond). The right area of the Script Wizard contains the methods
and properties for each of the objects. The properties are denoted
by a white icon containing small blue lines. The methods icon
is yellow and contains an exclamation mark (!). The bottom pane
contains the scripted actions for the Web page; you see two radio
buttons marked List View and Code View. List View displays a general
brief description of the code that was generated; Code View displays
the code itself.
Add a short procedure to the button so that when the user clicks
the button, the caption of the label changes:
- In the left pane (the Events window), click the plus sign
next to the CommandButton1 object.
- Click the word Click under the CommandButton1
object. This means that the code is attached to the Click
event of the button.
The next thing you must do is to link the event to the Label1
object; in other words, when the user clicks the button, firing
the click event, the program acts upon the Label1 object.
- In the right pane, click the plus sign next to Label1.
You see a list of the properties for the label object.
- Double-click the Caption property to display the
caption entry dialog box.
- Enter Hello ActiveX in the caption entry dialog box,
as shown in Figure 1.17.
Figure 1.17: Changing the Caption property of the label
from the CommandButton click event.
- Click OK, and the event is registered in the Actions pane
toward the bottom of the Script Wizard.
To view the actual code that is generated by the Script Wizard,
click the option marked Code View. That's how easy it is to add
active scripting to your Web pages. Before you rush off to try
your new page, you must add code to one more event.
Collapse the events list by clicking the minus (-) symbol next
to the CommandButton1 object. Do the same thing with
the Properties list for the Label1 object in the right
pane. Add code to the MouseMove event for the Label1
object that displays a message in the status bar at the bottom
of the browser:
- Click the plus sign next to the Label1 object in
the left pane.
You see a list of events for the label object. You might notice
that the events for a label are slightly different from the events
for a CommandButton.
- Click the MouseMove event.
- Move to the right pane and click the plus sign next to the
window object.
For this code, you want to interact with the browser itself. Scroll
down the list slightly to find the Status property.
- Double-click the Status property to display the text
entry box.
- Enter Goodbye Flat HTML Web Pages.
- Click OK.
To generate all the required code and return to the Text Editor,
simply click OK at the bottom of the Script Wizard screen. The
Script Wizard places the code for the two events on your HTML
page, which should now look like the page in Figure 1.18.
Figure 1.18: The Script Wizard automatically generates
the code for the two events and places it in the HTML file.
Save your welcome.htm file in the Control Pad Text Editor,
and run the page with the Internet Explorer to make sure it all
works (see Figure 1.19). When you pass the mouse arrow across
the label, a message appears in the browser's status bar at the
bottom of the screen. When you click the button, the label caption
changes to read "Hello ActiveX." Congratulations.
Figure 1.19: Your almost-finished welcome page.
You now have an active welcome page. As a welcome page, it's lacking
a major ingredient, though-links. Your welcome page should do
just that: welcome visitors to your site. From the welcome page,
your visitors then roam around your Web pages viewing, reading,
and generally experiencing that which interests them. How are
your visitors going to get from your welcome page to the rest
of the site? In HTML, you use the good old anchor tag, <A
HREF=...>...</>, and of course, you can use this
tag in your ActiveX page as well. But what you really want is
a state-of-the-art ActiveX hyperlink, right? Well, this is your
lucky day!
ActiveX and VBScript enable you to use any of the controls you
place on the screen as hyperlinks, buttons, images, and labels.
You can script everything in such a way that clicking the control
causes the browser to load a new page. In this section, you'll
create a hyperlink menu that actively displays a short description
of the linked page.
If welcome.htm isn't open in your ActiveX Control Pad,
open it for editing as you saw earlier.
To place the controls on the page in a logical order, you need
to construct an HTML table. The following code provides the framework
you need to add to the page under the button control and just
above the </CENTER> tag:
</OBJECT>
<TABLE WIDTH=80%>
<TD>
<!--The first pseudo hyperlink goes here-->
<TD ROWSPAN=2 VALIGN=TOP>
<!--The hyperlink description goes here-->
<TR>
<TD>
<!--The second pseudo hyperlink goes here-->
<TR>
</TABLE>
</CENTER>
The preceding definition creates a table in the center of the
page with two rows in the left column and a single row in the
right column that spans the two left rows.
Place your cursor under the first <TD> tag (the
top left cell), and select Insert ActiveX Control from the Edit
menu. Select the Microsoft Forms 2.0 Label control and click OK.
Amend the following properties to these values:
ID Link1
BackColor White
ForeColor Blue
Font Size 12 Point, Bold
WordWrap False
Caption My Links Page
You'll remember from the earlier sections that to change a property
value, you simply select the property you need to change in the
Properties window. Then, in the case of the ID and Caption
properties, type the new value into the text box at the top of
the Properties window and click Apply. For the other values you
need to change, click the ellipsis button-which displays the relevant
dialog for the particular property, either the color or font-and
then simply select what you need with a mouse click and click
OK.
TIP |
A neat shortcut to save time when setting properties is double-clicking the property value in the Properties window, which immediately invokes any associated dialog box or toggles the property value in a selection list (such as True or False).
|
After you set these property values, close the Object Editor window
to transcribe the object declaration to the HTML page.
Move your cursor so that it is under the <TD ROWSPAN=2
VALIGN=TOP> tag, which will contain the description of
the link. This tag appears on the right side of the table, and
as you can see, the cell takes up the whole height of the column.
You're going to place a label control here. Select Edit|Insert
ActiveX Control, choose Microsoft Forms 2.0 Label, and click OK.
Edit the properties for this label as follows:
ID LinkDescription
BackColor White
Font Size 12 Point
There is no caption because it is added actively. Unless stated,
all the other properties are left with their default values. The
only other thing you need to do with this label is increase its
size as follows:
- First, increase the size of the Object Editor by dragging
its lower-right corner.
- Place your arrow over the lower-right corner of the label
until your arrow changes to a northwest/southeast arrow.
- Drag the lower-right corner of the label. It's not vitally
important for the purposes of this exercise to get the dimensions
exact, but you need the label to be around 70 pixels high and
140 pixels wide. You can check the current size in the Properties
window; the property values change as you drag and release the
label.
Close the Object Editor, and you're ready to add the last object.
Place your cursor after the final <TD>, and insert
another label as you did before. Change its properties as follows:
ID Link2
BackColor White
ForeColor Red
Font Size 12 Point, Bold
WordWrap False
Caption My Fun Page
Close the Object Editor, save the page, and give it a test run
with the browser. Your page should look like the one in Figure
1.20.
Figure 1.20: Your welcome page complete with hyperlabels.
It takes several steps to create a hyperlink that lets the user
immediately identify what the link promises, both in terms of
its content and also its filename. You need procedures that provide
visual clues as the mouse is passed over the control, and you
must also instruct the browser to load the new page when the control
is clicked.
Add the following procedures to this page for each hyperlink:
- A MouseMove event that automatically places a text
string in the LinkDescription label control.
- A MouseMove event that automatically changes the
ForeColor (color of the font) of the LinkDescription
label control to that of the link label (to provide an additional
visual clue).
- A MouseMove event that automatically echoes the link
filename in the status bar of the browser.
- A Click event that instructs the browser to load
the link file.
With welcome.htm loaded in the ActiveX Control Pad, select
Script Wizard from the Tools menu.
To create the script that places text in the description label,
change the font color of the label and display a status message
when the user passes the mouse over the first link:
- Click the plus sign to the left of Link1 in the Events
pane.
- Select the MouseMove event from the list of Link1's
events.
- Click the plus sign to the left of LinkDescription
in the Actions pane.
- Double-click the Caption property from the list of
LinkDescription's properties and methods.
- Enter the following text into the Caption dialog: This
link takes you to my link page where you can find loads of links
to really cool pages-or words to that effect!
- Click OK.
- Double-click the ForeColor property, which is a few
items below the Caption property.
- Click a suitable shade of blue from the left palette and click
OK.
- Collapse the LinkDescription property list by clicking
the minus sign next to LinkDescription.
- Open the list of properties and methods for the window object
by clicking the plus sign next to Window.
- Scroll down slightly to find the Status property-in
fact, it's a property of the Self subobject.
- Double-click the Status property to display the Status
text dialog box. Here, you enter a URL that is shown in the status
bar at the bottom of the browser. You need to do this because
the browser does not recognize the label as an HTML hyperlink
and therefore does not display the usual "Shortcut to É."
You are in fact replicating the procedure that usually happens
within the browser for a hyperlink.
- Enter the following text:
Shortcut to http://www.anydomain.com/link.htm
Don't worry at this stage that neither the domain nor the
file exists; this is only an exercise, after all. Click OK.
You now have a list of three actions for the MouseMove
event for Link1, and your Script Wizard window should
look like the one in Figure 1.21.
Figure 1.21: Your Link1 MouseMove event action list.
Remain in the Script Wizard because you need to add the event
that changes the page when the link is clicked:
- Select Click from the list of events for Link1
in the left Events pane.
- Scroll the right pane to the top and double-click the top
item, Go to Page. This opens a dialog box in which you enter the
URL of the linked page. Because this is only an exercise, don't
worry about what you type here. After you enter a URL, click OK.
- Click OK at the bottom of the Script Wizard to generate all
the code for Label1, which should look something like
what you see in Figure 1.22.
Figure 1.22: The code automatically generated for the
Link1 object.
Figure 1.23: The finished welcome page with ActiveX
hyperlinks.
To complete your code for this welcome page, you need to repeat
the preceding steps for Link2. For Link2, choose
a green color for the LinkDescription ForeColor,
and when entering the caption for LinkDescription, use
wording that describes the fun page.
When you complete the code for Link2, save the HTML page
and open it in the browser. When you pass the mouse over the link,
two things happen. First, you see a description of the page on
the right of the link in the color of the link, and second, the
filename appears in the status bar.
You covered a lot of ground in this first chapter, and if some
of the terminology and methodology is unfamiliar and confusing,
don't worry too much at this stage. The goal of this first chapter
was to stimulate your imagination. You can see how straightforward
it is to create professional active content for your Web pages.
ActiveX goes beyond animation applets and things that look pretty;
it is about creating fully active content where all the objects
you place on the page can be programmed in some way to interact
with each other and with the browser, too.
Any programming language is just a beginning, an empty shell.
As with an artist's canvas and a palette of oils, it's up to you
to exploit the power of the language and add the creativity, and
that is what I will help you do through the rest of the book.
Now that you've had a chance to use some ActiveX controls, use
the ActiveX Control Pad, and write some basic VBScripts, you can
delve deeper into the rest of the book.
- To learn more about using VBScript, see Chapter 2 "Using
VBScript with HTML Controls."
- Chapter 12, "Using VBScript with ActiveX Controls,"
discusses ActiveX objects.
- For more information about the ActiveX Control Pad, see Chapter
13, "Implementing an ActiveX Menu Control."
Q: | Can I use other ActiveX controls that I've downloaded from pages on the Web?
|
A: | Possibly. Some ActiveX controls that your browser grabbed from a Web site as part of that site's content show up in the ActiveX Control dialog box. However, you cannot use many of these controls unless you have the license agreement for them. See Chapter 12.
|
Q: | How do I know that a user will have the controls I used in the welcome page example on his or her computer?
|
A: | In order for visitors to use this page, they must have Microsoft Internet Explorer 3; therefore, they must be running Windows 95. As a result, they'll have the Forms 2.0 controls ready and waiting. When you use other controls, you might need to provide copies of the controls on your Web site for the browser to download them. See Chapter 12.
|