For some of us, simply opening new browser windows without the buttons is not enough.
A browser window without the address bar, back and forward buttons,
and status bars is considered too 20th century. People like us are
always in the endless quest for creating something different that
interests the visitors. If whatever interests visitors can also
be done in Flash, the 'something different' becomes a necessity that
everyone, including you, should know about.
Well, not exactly. This
effect is quite nice in that it enables you to customize the menu and
title bar of a new window you open in Flash. For an example of what I
am alluding to, click the following Flash button:
Making Everything
Work
First, you will need to create a
button in Flash. Once the button has been created, right click on
the button and select Actions. Select Get URL by going to Basic
Actions and Get URL. You will now be able to enter the URL that will
enable the borderless window to launch. Copy and paste the following
code:
As you can presume, portions of the
above code have been colored in for a reason. The code colored in blue
refers to the file name of the page you want to display in the
borderless window. You can change page.html to reflect the name of
your page. Examples of names you can use include:
page.htm
content/page.htm
http://www.kirupa.com/page.htm
page.asp
The green text in the code refers to
the width and height of the borderless window. The first number refers
to the width of the borderless window. The second number refers to the
height of the borderless window. From the above code, you can see that
that the window will be 450 pixels wide and 250 pixels tall. You can
modify the height and width of the window to any value you desire!
Modifying the HTML Page
Once you have your button created, insert the SWF file into an HTML
page. You will need to add some code into your HTML to display the
borderless window. Open the HTML page containing your SWF file for
editing. Add the following lines of code into your HTML page:
It is time to make sense of the code
you just copied. I will not be explaining what every facet of the code
accomplishes, but I will list the important values that you may choose
to modify to customize your borderless window. The following table
should help you in customizing the code:
Variable
What it Does
cD
Allows you to change
the change the image that is displayed when close button is
pressed. In my example, the image was a x.
cU
Allows you to change the image that is displayed when the close
button is in its default Up state.
cO
Allows you to change
the image that is displayed when the close button is hovered
over.
tH
Enables you to change the title that is displayed in the Window.
tW
Another area where the title can be defined. The tH variable
controls what is displayed however.
wB
Enables you to change the color of the border when the window is
displayed.
wBs
Enables you to change the color of the border when the window is
selected or dragged.
wBG
Enables you to change the background color of the title bar.
wBGs
Enables you to change the background color of the title bar when
the title bar is selected.
Tip:
You don't have to create a separate
image for all of the over states for the close button/image. You
can use the same image three times (as in my example).
Once you have customized the code to
your liking you are all set to test out your borderless window
example...except for one major detail. The javascript references to a
file called chromeless.js. You will need to download that file by
clicking the following link:
chromeless.js
After the file has been downloaded,
extract the file and upload it to the directory containing your HTML
file. Without this file in the same directory, your borderless window
will not work. Now, preview your HTML page and click the button you
created in Flash. You should see a borderless window appear.
Credits
The originator of the 'Chromeless Browser Window' can be found at the
following URL: http://www.microbians.com/
Just a final word before we wrap up. What you've seen here is freshly baked content without added preservatives, artificial intelligence, ads, and algorithm-driven doodads. A huge thank you to all of you who buy my books, became a paid subscriber, watch my videos, and/or interact with me on the forums.
Opening
Borderless Windows
