Categories


Streaming Horizontal Banner-JAVA Script

Click this image to see a Streaming Horizontal Banner in actionThis is a really good JAVA script – if you’re looking for a streaming horizontal banner. And, it can be adapted to display more than the three images in the original script as well as made to display larger sized images in a larger banner container.  (Click the image to see this script in action.)

You’ve heard me mention before that you can find good free JAVA Scripts at http://javascript.internet.com/. You’ve also heard me say that you need to know a bit of how JAVA is constructed to be able to use the scripts and modify them when necessary.

Such is the case with this script. Needed to make an update to a client’s page last week. Found exactly the look they requested; however, the script did not fit what the client wanted which was to display five large pictures (no hyperlinks) in a streaming horizontal banner. (The original script is written for three smaller-sized images with links to off-site webpages.)

After working through the changes, thought it might be helpful to others to see what parts of the script need to be changed. So we’re going to take a look at the changes I made to display five images in a larger banner. For purposes of our discussion, we will be addressing only those portions of the script that affect the size and number of images used and how they are displayed.

To view the original script in it’s entirety, visit http://javascript.internet.com/.   From the JAVA Script home page menu; click on Image Effects; then search for Streaming Horizontal Banner by Jeroen Haan. To access the script code, click on the script’s Title link. This will open a page with four tabs:

  1. General – Description and sample streaming banner
  2. Notes – Creation info and short code to insert on the HTML page if you are having a problem with it working in the browser.
  3. Source code – Four tabs with External Files, CSS, Head and Body codes
  4. User comments – See what others have to say and if you’re having trouble. . .good place to ask for help.

You may find it helpful to view the whole script and get a little familiar with it before continuing with the information below.

The Source Code

We will be covering the four parts of the source code as this is what you will need to implement to use this script.

1. External Files – Paste this code into an external JavaScript file named . .

streamingBannerHorizontal.js

. . . and upload to the website’s root directory. (This script can be used without any changes, if you will be using three images that do not exceed 124 pixels in width with a maximum height of 60 pixels.)

2. CSS – Paste this code into your external CSS file OR in the