draac.com logo
 
 

Marquee Lesson

 

Marquees For IE And MSNTV

Marquee is an Internet Explorer tag. MSNTV supports the marquee tag but not all of it's attributes. Some of the attributes apply only to the latest versions of Internet Explorer. We will look at those later in the lesson.

Netscape does not support the marquee tag. Keep that in mind when using the marquee tags. It will show as static text on your web page.

Always place the marquee tags on either side of your text after your <font> tag. Then close the marquee before your closing </font> like in this example code below:

Example Marquee Code:

<font size="2" color="#0000cd" face="verdana">
<b>
<marquee>
Draac.Com
</marquee>
</b>
</font>

Tip - Remember, Always close your tags in the reverse order that you have opened them.

Marquees And Their Attributes

Just a note before we begin to look at some examples. Don't be affraid to mix and match these attributes. Many can be joined together to give you some cool effects. Be creative and experiment with the various marquee attributes found in this lesson.


Draac.Com

Attribute:   None

Html Code:
<marquee>Draac.Com</marquee>


Draac.Com

Attribute:   Loop
Note: the marquee will stop after the number of times looped

Html Code:
<marquee loop="5">Draac.Com</marquee>

This looping marquee loops 5 times and stops.
Reload to see it in action again.

Draac.Com

Attribute:   Bgcolor

Html Code:
<marquee bgcolor="#00ffff">Draac.Com</marquee>


Draac.Com

Attributes:   direction/right or left
Note: direction left is the default direction

Html Code:
<marquee direction="right">Draac.Com</marquee>


Draac.Com

Attributes:   width and/or height

Html Code:
<marquee width="200">Draac.Com</marquee>


Draac.Com

Attributes:   behavior/slide

Html Code:
<marquee behavior="slide">Draac.Com</marquee>

This sliding marquee slides once and stops.
Reload to see it in action again.

Draac.Com

Attributes:   behavior/alternate

Html Code:
<marquee behavior="alternate">Draac.Com</marquee>


Draac.Com

Attributes:   scrollamount
Note: this will determine the speed of the marquee

Html Code:
<marquee scrollamount="30">Draac.Com</marquee>


Draac.Com

Attributes:   scrolldelay
Note: this will delay the speed of the marquee

Html Code:
<marquee scrolldelay="200">Draac.Com</marquee>


Draac.Com
Attributes:   scrolldelay/scrollamount
Note: this might take a little practice & tweaking.

Html Code:
<marquee scrolldelay="500" scrollamount="400">
Draac.Com
</marquee>

IE5.0+ Only Marquees

The latest editions of Internet Explorer support the marquee tags with images or text. Try adding the above attributes to images and see what you come up with.

These next marquees will not work with MSNTV.

Below are a few examples:


Draac Ape

Attribute:   None

Html Code:
<marquee>
<img src="ape.gif" width="120" height="82" alt="Draac Ape">
</marquee>


Draac Ape Cool Ape !

Attribute:   direction/right
Note: direction left is the default direction

Html Code:
<marquee direction="right">
<img src="ape.gif" width="120" height="82" alt="Draac Ape">
Cool Ape !
</marquee>


Draac Ape

Attribute:   direction/up or down

Html Code:
<marquee direction="down" height="90">
<img src="ape.gif" width="120" height="82" alt="Draac Ape">
</marquee>


Draac.Com
The Place To
Learn New
Things Each Day.

Draac Ape

Attribute:   direction/up or down

Html Code:
<marquee direction="up" height="100">
Draac.Com<br>
The Place<br>
To Learn New<br>
Things Each Day.<p>
<img src="ape.gif" width="120" height="82" alt="Draac Ape">
</marquee>

A Final Note

Marquees can be fun to use, but remember a little bit goes a long way. Don't flood your page with marquees, use them to help a line or two of text stand out from the rest of your web page. Always keep in mind that Netscape users can not see marquees, they will see your text, but it will not be moving in the marquee.

PS: Netscape users, you have a text command that IE or MSNTV can not see with their browsers...BLINK..:+)

<blink>Some Text Here</blink>

Always Having Fun,
Draac