HTML <marquee> Tag

Note: இந்த <marquee> அம்சங்கள் வழக்கற்றுப் போய்விட்டது. எனினும் இது இன்னும் சில browser-களில் வேலை செய்யக்கூடும் என்றாலும், இது எந்த நேரத்திலும் அகற்றப்படலாம் என்பதால் அதன் பயன்பாடு discourage செய்யபடுகிறது. அதைப் பயன்படுத்துவதைத் தவிர்க்க முயற்சி செய்யுங்கள்.

<marquee> என்பது webpage-ல் image அல்லது text-ஐ scrolling செய்ய பயன்படுத்தப்படுகிறது. It can scroll horizontally across or vertically down.

இதில் 4 வகையான scrolling உள்ளன

  1. scrolling left (default)
  2. scrolling right
  3. scrolling up
  4. scrolling down
Note:<marquee> பயன்படுத்தும்போது உங்களுடைய webpage break-ஆக வாய்ப்பிருக்கிறது.

Marquee tag Syntax

The <marquee> element comes in pairs. அதாவது opening (<marquee>) and closing (</marquee>) elements.

<!DOCTYPE html>
<html>
    <head>
        <title>Marquee Tag</title>
    </head>
    <body>
    <marquee>
        It's never too late new beginning in your life.
    </marquee>
</body>
</html>

Output:

It's never too late new beginning in your life.

Attributes

The following attributes can be used to adjust the appearance of the <marquee> element.

Attribute Value Description
behavior scroll
slide
alternate
Defines the scrolling type.
bgcolor rgb(x,x,x)
#xxxxxx
colorname
Is used to give a background color.
direction up
down
left
right
Sets the direction for the scrolling content.
height pixels
%
Defines the marquee's height.
hspace pixels Defines horizontal space around the marquee.
loop number Defines how many times the content will scroll. If we don't define this, the content will scroll forever.
scrollamount number Defines the scrolling amount at each interval in pixels. Default value is 6.
scrolldelay seconds Defines how long delay will be between each jump. The default value is 85 and smaller amounts than 60 will be ignored.
truespeed seconds Is used to delay the scroll lesser than 60.
vspace pixels Defines vertical space around the marquee.
width pixels
%
Defines the marquee's width.

Text Scroll with background color ,behavior and direction

<!DOCTYPE html>
<html>
    <head>
        <title>Marquee Tag</title>
    </head>
    <body>
    <marquee bgcolor="#005d8c;" behavior="alternate" direction="up">
        It's never too late new beginning in your life.
    </marquee>
</body>
</html>

Output:

It's never too late new beginning in your life.

Example: Scroll Image with vspace

<!DOCTYPE html>
<html>
    <head>
        <title>Marquee Tag</title>
    </head>
    <body>
    <marquee vspace="20px;"  direction="up">
        <img src="images/quote1.jpg" width="200"  /><br>
        <img src="images/quote2.jpg" width="200"  /><br>
        <img src="images/quote3.jpg" width="200"  /><br>
        <img src="images/quote4.jpg" width="200"  /><br>
    </marquee>
</body>
</html>

Output:





Text with scrollamount

<!DOCTYPE html>
<html>
    <head>
        <title>Marquee Tag</title>
    </head>
    <body>
    <marquee bgcolor="#005d8c;" behavior="scroll" scrollamount="20">
        It's never too late new beginning in your life.
    </marquee>
</body>
</html>

Output:

It's never too late new beginning in your life.

Text with scrolldelay

<!DOCTYPE html>
<html>
    <head>
        <title>Marquee Tag</title>
    </head>
    <body>
    <marquee bgcolor="#005d8c;" behavior="scroll" scrolldelay="80">
        It's never too late new beginning in your life.
    </marquee>
</body>
</html>

Output:

It's never too late new beginning in your life.

Comments