Home >>HTML Tutorial >HTML Marquee

HTML Marquee

HTML Marquee Tag

HTML marquee tag is used to move the text/image from right to left, left to right, up to down and down to up. An HTML marquee is a scrolling element of text shown either horizontally across or vertically down your web-page. This is developed by using HTML marquees tag.

Eg

<marquee > welcome to the world of PhpTponit </marquee>
Output
welcome to the world of PhpTponit

in the above example
* A message enclose within marquee tag...
direction of marquee scroll by default is left direction..given message moving to left.


Change moving direction use direction property.

There are four types of marquee direction : up,down,left,right.

<marquee direction="right">

welcome to the world of Phptpoint

</marquee>

Output
welcome to the world of Phptpoint

*in the above example..
we can change the direction of marquee use direction property
if we set the property(direction="right"). text scroll towards right of a web page.


Move your text/image in alternative direction use behavior property.

<marquee direction="right" behavior="alternate">
welcome to the world of Phptpoint
</marquee>
Output
welcome to the world of Phptpoint

*in the above example..
If set the value of behavior is alternate with direction right..in marquee tag in first statement
then display message direction reverse when it reaches the edge of cell


Stop moving text/image when mouse is over at text/image .

<marquee  onmouseover="stop()">

welcome to the world of PhpTponit 

</marquee>

Output
welcome to the world of PhpTponit

*in the above example
marquee have another property(onmouseover)with value("stop()").
It stops the marquee text/message, when the mouse cursor over at the message/text.


Start moving text/image when mouse is out from text/image .

<marquee  onmouseover="stop()" onmouseout="start()">

welcome to the world of PhpTponit 

</marquee>

Output
welcome to the world of Phptpoint

*in the above example
We set property,(onmouseover) with(value="start"), (onmouseout) with (value="start") both together.

Marquee scroll when the mouse cursor is move out.

Maqquee scroll is stop when the mouse cursor is over the text/image.


increase/decrease speed of moving text use scrollamount property

To move at slow motion

<marquee  scrollamount="1">

welcome to the world of Phptpoint 

</marquee>

Output
welcome to the world of Phptpoint

*in the above example
Scrollamount property is used to give speed to marquee ,Smaller scrollamount value make scroll marquee slower


To move at fast motion

<marquee  scrollamount="25"> 

welcome to the world of Phptpoint 

</marquee>

Output
welcome to the world of Phptpoint

*in the above example
Now set the marquee with( scrollamount="25") marquee scroll fast.
as such as we increase or decrease the value of scrollamount, marquee speed becomes vary


No Sidebar ads