How Do I....?

HOW DO I . . .????

Well! Finally! This page has been a long time in coming and hundreds of you have submitted questions! Of those questions, these three are the most frequently asked. The other questions, well... Let's suffice it to say I've answered email regarding the graphics programs I use, how I make the 3-D text and drop shadows, etc! But that will be added to this page at some later date. Right now, I'm sticking to the HTML basics. <grin>

Border Backgrounds

Bordered backgrounds have hit the Internet like wildfire! And, in the scramble, people are trying to find the best way to use them so everything is aligned correctly and the text doesn't "run into the border". Having designed hundreds of these backgrounds, I've come up with a recipe that works - no matter which browser is being used to view the pages and no matter how the resolution is set.

Basically, what you have to do is set up a table on your page. In the mind's eye, it will look like this:

The column on the left is cell #1. This is the border. Now, when you create a table, you can assign a width to the cell. However, that doesn't always work with bordered backgrounds. This is why I use the "vspacer.gif" - the key ingredient to a successfully bordered page. The "vpacer.gif" is a transparent rectangle. Assigned a width to accommodate the width of your border (typically 125 pixels) and height of "1", it acts as a barrier to keep the text from the body of your page from running into your design. The sample specifies a width of 125 pixels, but you can change that figure according to the background you're using.

The following is how a page is typically set up:

To show you what the straight code will look like, this is the example:

<html>
<head>
<title> Title of Page </title>
</head>
<body background="name-of-bg.jpg" bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FF0000" alink="#FFFFFF">
<table>
<tr><td valign=left align=top><img src="vspacer.gif" height=1 width=125></td><td valign=left align=top width=100%>

</td></tr></table>
</body></html>

And that's it! If you want, you can highlight the code, copy and paste it to your html document. Where it's indicated that you "insert page content here" - well, that's where you put your "stuff"!

For examples, go to Windy's Fashionable Page Designs, download some borders that "ring your chimes" and then take a look at the source codes of those pages. The "vspacer.gif" is downloadable at that site as well.

TOP OF PAGE

Embedded Midis

Boy, do I love music! And I love putting them on my pages so others can enjoy them! Many of you have asked how to "put music on my page". There are several ways to accomplish this, but I'll give you three of the most popular methods.

METHOD #1

Embedded Midis: With the newer versions of MSIE and Netscape, there is a built-in ability to play the midis. In order to embed one on your page, I've included the coding for both the large and small console:

If you'd rather the midi didn't start automatically, simply remove autostart=true from the line. The code to make it play indefinately is loop=true... however, most people find that rather irritating so I personally don't do that.

METHOD #2

Graphical Link: If you'd like a page full of midis so people can click on a button of their choosing, use a graphic of your choice and hyperlink it to the midi like so:

METHOD #3

Text Link: For those who want a fast-loading page without a lot of graphics, there's the text link! I've created a couple of examples for you. (Enjoy listening to the music!)

American Bandstand
Beetlejuice
We Built This City

And here is the code:

<a href="bandstan.mid">American Bandstand</a><br>
<a href="beetljuc.mid">Beetlejuice</a><b>
<a href="builtcty.mid">We Built This City</a>

TOP OF PAGE

JavaScript - The Scrolling Ticker

Okay, folks. Here it is. Highlight the entire code, copy and paste it to your document right after the <body> tags and go for it! Make sure, though, that you replace the red areas where you want your own message.

<SCRIPT LANGUAGE="JavaScript">

/* Copyright (C)1996 Web Integration Systems, Inc. DBA Websys, Inc. All Rights Reserved. This applet can be re-used or modified, if credit is given in the source code. We will not be held responsible for any unwanted effects due to the usage of this applet or any derivative. No warrantees for usability for any specific application are given or implied. Chris Skinner, January 30th, 1996. Hacked for CNNfn by RD, Jan. 31, 1996
*/

function scrollit_r2l(seed)
{
var m1 = "TYPE IN YOUR MESSAGE HERE.... ";
var m2 = "TYPE IN MORE STUFF HERE..... ";
var m3 = "TYPE IN EVEN MORE STUFF HERE!...... ";
var msg=m1+m2+m3;
var out = "WELCOME TO MY PAGE! || ";
var c = 1;
if (seed > 100) {
seed--;
var cmd="scrollit_r2l(" + seed + ")";
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 100 && seed > 0) {
for (c=0 ; c < seed ; c++) {
out+=" ";
}
out+=msg;
seed--;
var cmd="scrollit_r2l(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else if (seed <= 0) {
if (-seed < msg.length) {
out+=msg.substring(-seed,msg.length);
seed--;
var cmd="scrollit_r2l(" + seed + ")";
window.status=out;
timerTwo=window.setTimeout(cmd,100);
}
else {
window.status=" ";
timerTwo=window.setTimeout("scrollit_r2l(100)",75);
}
}
}
// -- End of JavaScript code -------------- -->

</SCRIPT>

TOP OF PAGE

<BACK

I know my domain is in good hands with:

The Internet Connection