JavaScript Window/Random Midi This script can be used to display anything in a
popup window, in this case it's used for the jukebox,, but all you have to do is change
the height and width of the window and the URL of the file, and you can display anything
in it.
To get a button like the one on the left side
of this page you'll need to follow a couple of simple steps.
First, you're going to a page that is the
"jukebox". You're going to just save that page as "jukebox.html" so
now Click Here. Then come back here.
Click Here
and in the window that opens, highlight and copy the code that appears. That code should
be pasted into your page to appear just as it is in the window. Be sure the line
that begins ('jukebox.html', is all on one line when you paste it into your page. If
you're using a program like FrontPage, you'll have to insert it using the
"Insert" menu or paste it into the HTML tab.
On the page you want the button to appear,
copy and paste the following code where you want the button:
<FORM><INPUT type="button"
name="button_one" value="MUSIC"
onclick="popwindow2()"></FORM>
Now you'll have to upload 5 MIDI files
to the same directory as the pages. The "jukebox.html" page calls for the files
to be named "midi1.mid" "midi2.mid" "midi3.mid"
"midi4.mid" and "midi5.mid". You can rename the files either before or
after you upload them.
You're all set. The file "jukebox.html" has a
tag in it that causes the page to "refresh" every 300 seconds. If you like, you
can change that if your MIDI files are longer.
TOP
Simple Image Rollover
Script
(works for Netscape and IE 4.0)
This is the same script used on this site, of course you can
just view the source of the page to get the code, but here it is anyway. Keep in
mind that McWebber isn't a programmer, but I'll do my best to explain how I think this
works in layperson terms.
First the basic JavaScript you will need. This is for a
single image. In this example the image filenames are image1.gif and image2.gif but your
images can be named anything as long as they have a 1 and a 2 as part of their name. In
this case, image1.gif is the image you want to be seen when the page loads and image2.gif
is the image to be seen when the mouse is moved over the image. It certainly helps
if both images are the same size. For more images, copy and repeat the red part of the
script and add new images to it.
<script LANGUAGE="JavaScript">
<!--
if (document.images) {
var image2 = new Image()
image2.src = "images/image2.gif"
var image1 = new Image()
image1.src = "images/image1.gif"
}
function act(imgName) {
if (document.images)
document[imgName].src = eval
(imgName + '2.src')
}
function inact(imgName) {
if (document.images)
document[imgName].src = eval
(imgName + '1.src')
}
// -->
</script>
This script will, when used with the following code, replace
one image in your page with another on mouseover, and then switch back to the original
image when the mouse is moved out. You can see how it works with the links in the
left column of this page if you have the proper Java enabled browser.
Copy the code above and paste into the HTML of your page.
Don't try to copy that code from the source of this page since I use the > and the
< to show the < and the > symbols.
Now, here's the code you put where you want the mouseover to
occur.
<a HREF="http://anydomain.com/"
onMouseOver="act('image')" onMouseOut="inact('image')"><img
SRC="images/image1.gif" HEIGHT="24" WIDTH="96"
NAME="image" BORDER="0" ALT="ALT TEXT"></a>
This code tells the browser to change the active image from
image1.gif to image2.gif and back to image1.gif when the mouse is moved out. You see in
the main JavaScript where the functions for "inact" and "act" are set
and why each image name has to end in 1 or 2.
In the above code you see the word "image" several
times. If your file is a different name, put it there but make sure they all are the same
or you'll get JavaScript error messages, and we know what a pain in the butt they are.
If you want to have more than one image as I do on this page,
then you just repeat the first four lines of the main JavaScript. View the source of
this page and you'll see it. Those four lines occur after: "if
(document.images) {"
Then you just put in your next image name and filename in, again making sure they end in 1
and 2 to match the script.
TOP
Status Bar Message Script
Rather than display the entire script here, it's pretty long.
View the source of this page and copy the script. You can identify it by:
// This JavaScript is in the Public
Domain.
Copy everything until the closing
</script> tag and paste it into your HTML just before the
</HEAD> tag.
Then you'll also need the tag
that goes inside your <BODY> tag:
ONLOAD="window.config.timer=window.setTimeout
('sbprint()',window.config.delay)"
TOP
Automatic Frames Break
If you don't want your page to show up in the
frame of someone else's page, just add this JavaScript to your page:
Now when your page loads in someone else's
frame, it will break out.
For more information on JavaScript, see my LINKS page.
|