Choose a link to get started:

ALL NEW!!!

 Scrolling Marquees

The Basics

 The Basics
Manipulating Text
Images
Backgrounds
Links

More Advanced Topics

 The <HEAD> Tag
Tables
Forms
Frames
Lists

Advanced Topics

 Image Maps
CSS - Part 1
CSS - Part 2
CSS - Part 3
CSS - Part 4

Additional Topics

 XML Tag Formatting
XHTML - Part 1
XHTML - Part 2

Internet Explorer Marquees

         Notice I said "Internet Explorer Marquees". Unfortunately for all of you Netscape users, this is another one of those topics that is solely for the Internet Explorer user, but feel free to learn the commands anyway. It adds excitement to your page when viewed through Internet Explorer.


Now, let's take a look at the script that made the scrolling marquee above:

<MARQUEE>Internet Explorer Marquees</MARQUEE>

        As you can see, the tag for a scrolling marquee is somewhat predictable. The <MARQUEE> tag acts similar to the <FONT> tag. The text in between <MARQUEE> and </MARQUEE> is the text that will scroll according the parameters defined in the <MARQUEE> tag.


Let's take a look at those parameters:

  • ALIGN
  • BEHAVIOR
  • BGCOLOR
  • DIRECTION
  • HEIGHT
  • HSPACE
  • LOOP
  • SCROLLAMOUNT
  • SCROLLDELAY
  • TRUESPEED
  • VSPACE
  • WIDTH



ALIGN


        The first attribute is ALIGN. This determines how the scrolling test is aligned vertically with the surrounding text. There are three possible values for this attribute: TOP, MIDDLE, and BOTTOM. The default is MIDDLE. The syntax for using the ALIGN atrribute is shown below:

<MARQUEE ALIGN="middle">



BEHAVIOR


        The BEHAVIOR attribute determines how the marquee rolls across the screen. There are three possible values for this attribute as well: SCROLL, SLIDE, and ALTERNATE. The default is SCROLL, which starts with the marquee completely off the page and ends with it completely off. SLIDE starts the same way, but starts again when it hits the other end. ALTERNATE causes the marquee to bounce back and forth between the edges. To clarify the exact behavior of each, an example of each is provided below:

Just SCROLLing across the page...

Doing the electric SLIDE

Forward and back...ALTERNATE

<MARQUEE BEHAVIOR="slide">



BGCOLOR


        This attribute should be self-explanatory. It controls what the background color of the marquee is. The color designation can be the word or RGB color codes. The background color of the previous examples for BEHAVIOR is "#000080"

<MARQUEE BGCOLOR="#000080">


DIRECTION


        This determines which direction the marquee scrolls, whether it be to the left or the right, the two possible values for DIRECTION. The default direction is left. An example of each is shown below to show exactly what DIRECTION="left" and DIRECTION="right" mean:

Moving on over to the LEFT...

Going the RIGHT way

<MARQUEE DIRECTION="left">



HEIGHT and WIDTH


        The next two topics will discussed together, as they are often used together. The HEIGHT attribute determines the vertical height of the marquee, and the values are in pixels. The WIDTH attribute determines the horizontal width of the marquee, with the value being in pixels or a percentage of the screen. An example of each attribute is shown below:

Only 25% of the width

100 pixels high


<MARQUEE HEIGHT="100" WIDTH="25%">



HSPACE and VSPACE


        These two will also be explained together, but they are a little difficult to explain. They determine the margins on the respective sides of the marquee with respect to the surrounding text or the edge of the page. HSPACE stands for Horizontal-SPACE and is the margin on the left and right sides of the marquee, in pixels. VSPACE stands for Vertical-SPACE and determines the top and bottom margins of the marquee, also in pixels. Here are a few examples:

The HSPACE here is 25 pixels
The text here is 35 pixels away...The VSPACE here is 35 pixels..from the marquee with VSPACE="35"

<MARQUEE HSPACE="25" VSPACE="35">



LOOP


        The LOOP attribute determines how many times the marquee runs without stopping. The default for BEHAVIOR="scroll" or ="alternate" seems to be infinite, while it is only 1 for BEHAVIOR="slide". The values are in number of runs. To set the marquee to run an infinite number of times, set LOOP="-1". This doesn't always work with BEHAVIOR="slide" so be careful to check how the marquee looks when using "slide" with LOOP.

<MARQUEE LOOP="15">



SCROLLAMOUNT, SCROLLDELAY, and TRUESPEED


        These topics are also difficult to explain. SCROLLAMOUNT sets the number of pixels between each roll of text and indirectly sets the speed, the higher the faster. The larger the number, the larger the delay between rolls. SCROLLDELAY determines the speed of the marquee, in terms of the number of milliseconds between each text character. TRUESPEED is used if the SCROLLDELAY is below 60. An example of each is shown below:

SCROLLAMOUNT="1"

SCROLLDELAY="75"

<MARQUEE SCROLLAMOUNT="100" SCROLLDELAY="35" TRUESPEED>



        Well, now you have a new weapon to add to your HTML arsenal. Marquees can add great effects to your webpage, but you must also be careful with them. While they look good when used in moderation, be careful not to use too many marquees on the same page, as it makes the page far too busy and an eyesore. Enjoy!