Marquee
On this lesson you will learn how to set up 5 different types of Marquee's. You are required to place all of these Marquees on your class.html page. This will give you a working knowledge of these types of Marquees. However you are NOT required to place all of these on your Dedication.html page.
For this lesson, you will need to open your computer's notepad program and your Internet Explorer browser. When writing HTML code, we will always be writing the actual code into notepad and copying and pasting into an HTML editor.
A Marquee is unlike a Style or Javascript's. You can actually place a Marquee anywhere on your Web Page within the body tag. But there is one major down fall, the Marquee will ONLY work with the Internet Explorer Browser.
The Standard Marquee:
The Loop Marquee:
If by chance you do not see 5 marquee's running at the same time below, please refresh the page.
The width attribute below can be changed to any width you like. The bigger the width the longer the Marquee travels.
Explain Loop="":
The Loop element controls how many times the Marquee will run before it stops {ie.} Loop="5" the Marquee will run 5 times before it stops.
<marquee width="200" loop="1">Loop="1" Marquee!!!</marquee>
<marquee width="200" loop="2">Loop="2" Marquee!!!</marquee>
<marquee width="200" loop="3">Loop="3" Marquee!!!</marquee>
<marquee width="200" loop="4">Loop="4" Marquee!!!</marquee>
<marquee width="200">With out Loop Marquee. This will run
continuously.</marquee>
A Marquee with a Background color:
<marquee width="400" bgcolor="#F0DDBD">Change the Background color and have some fun with this one..</marquee>
A Marquee with a speed control:
The speed or how fast the Marquee scrolls is controlled by the {scrollamount=" "}. You can insert a number from 1 - 100 the higher the number the faster the Marquee will travel.
Try putting the number 100 in this setting and see how fast the Marquee moves.
<marquee width="200" bgcolor="#F0DDBD" scrollamount="1">Scrollamount=1</marquee>
<marquee width="200" bgcolor="#F0DDBD" scrollamount="2">Scrollamount=2</marquee>
<marquee width="200" bgcolor="#F0DDBD" scrollamount="3">Scrollamount=3</marquee>
<marquee width="200" bgcolor="#F0DDBD" scrollamount="4">Scrollamount=4</marquee>
<marquee width="200" bgcolor="#F0DDBD" scrollamount="5">Scrollamount=5</marquee>
A Marquee that scrolls up or down:
I saved the best for last, this is by far the best Marquee I have found on the net. In order to change the direction of the Marquee just replace the {up} with {down}. You can really have some fun with this one. I have beefed up this Marquee to make it look much better. The below coding is the actual coding I used to make the Marquee you are looking at now.
For this Marquee I will place the coding below the Marquee because it is a little bigger then the others...
|
<Table border="4" bordercolor="#800000" bgcolor="#000000" cellpadding="5" cellspacing="5">
<TR>
<TD>
<img border="0" src="https://www.angelfire.com/ga4/mousepadcloud/lesson3/images/LORD.jpg" alt="Jesus Christ" width="150" height="194">
<MARQUEE width="300" scrollamount="2" bgcolor="#F0DDBD" scrolldelay="100" behavior="scroll" DIRECTION="up">
<center>
Hello!
This is an example of upward scrolling marquee.
For God so Loved the World
That he gave his ONLY Begotten Son
That whosoever Believeth in him
shall NOT Parrish.
But have everlasting life..
John 3:16
Please stop by my Web Site and sign my Guest Book.
<a href="http://members.fortunecity.com/gaotn/index.html">The Robinson Family</a>
Have fun!</center></marquee></TD></TR></Table>
If you are finished with the Marquees
click on the Back link below to go back to the main page of lesson 3.
