[HTML code] Moving text (marquee)

Source: Internet
Author: User
[HTML Code ] Text to be moved (marquee)

The marquee tag is used to scroll text in the available browsing area. This tag is only applicable to browsers later than ie3.
Format:
<Marquee align = "... "
Behavior = "... "
Bgcolor = "... "
Direction = "... "
Height = "... "
Width = "... "
Hspace = "... "
Vspace = "... "
Loop = "... "
Scrollamount = "... "
Scrolldelay = "... "
Onmouseout = This. Start ()
Onmouseover = this. Stop ()
>...
</Marquee>

Attribute:
Align: Used to align the scrolling text based on the set value. Align can be set to left, center, right, top, and bottom. This attribute is not required.
Example:
<Marquee align = "TOP"> set the scroll text to alignment </marquee>


Behavior: allows the browser to process the text as set once the text appears on the page. If the set method is slide, the text will be moved to the document and stuck on the margin. If it is set to alternate, the text is moved from one side to the other. If it is set to scroll, the text will be repeatedly rolled on the page. This attribute is not required. You can set the following values: silide, alternate, and scroll.
Example:
<Marquee behavior = "alternate"> move text from one side to the other </marquee>


Bgcolor: used to set the background color of a subtitle. The background color can be set in RGB, hexadecimal format, or color name.
Example:
<Marquee bgcolor = "red"> set the color of the scrolling text background to red with the color name. </marquee>
<Marquee bgcolor = "# ff0000"> use a hexadecimal value to set the color of the scrolling text background to Red. </marquee>
<Marquee bgcolor = RGB (100%, 0%, 0%)> Use RGB to set the color of the scrolling text background to red. </marquee>

Direction: used to set the direction of text scrolling. You can set the following values: left and right. This attribute is not required.
Example:
<Marquee direction = "Left"> text scroll to the left </marquee>
<Marquee direction = "right"> text scroll to the right </marquee>

Height: used to set the height of a rolling subtitle. The height can be expressed by pixel or percentage of a visible page. This attribute is not required.
Example:
<Marquee Height = "10%"> the height of rolling subtitles is 10% of the visible page. </marquee>
<Marquee Height = "12"> the height of a rolling subtitle is 12 pixels. </marquee>

Width: used to set the subtitle width. The width can be expressed by the percentage of pixels or visible pages. This attribute is not required.
Example:
<Marquee width = "90%"> the width of the scroll subtitle is 90% of the visible page. </marquee>
<Marquee width = "200"> the width of a rolling subtitle is 200 pixels. </marquee>

Used to set the Left and Right blank space for Rolling subtitles. the blank space is represented in pixels. This attribute is not required.
Example:
<Marquee hspace = "15"> the Left and Right blank space of the rolling subtitles is 15 pixels </marquee>

Vspace: Used to Set Up and down spaces for Rolling subtitles. the blank space is represented in pixels. This attribute is not required.
Example:
<Marquee vspace = "2"> the space in the upper and lower spaces of the scrolling subtitles is 2 pixels </marquee>

Loop: used to set the number of scrolling subtitles. When the loop value is "infinite" or "-1", the text will scroll unlimitedly. This attribute is not required.
Example:
<Marquee loop = "-1"> text scrolling countless times </marquee>
<Marquee loop = "5"> text scrolling 5 times </marquee>

Scrollamount: used to set the interval after each continuous scrolling text, which is represented in pixels. This attribute is not required.
Example:
<Marquee scrollamount = "10"> the interval after the text is 10 pixels </marquee>

Scrolldelay: used to set the interval between two rolling operations, in milliseconds. This attribute is not required.
Example:
<Marquee scrolldelay = "5"> the interval between two scrolling texts is 5 ms </marquee>

Onmouseout = This. Start (): used to set the scroll continued when the mouse moves out of the area.
Onmouseover = this. Stop (): Used to stop scrolling when the mouse moves into this area.

-------------------------------------------------------------

<Table Height = 393 cellspacing = 0 cellpadding = 0 width = 524 align = center bgcolor = # d1f6db border = 0> <font size = 4> <font color = #990033> </ font> </font>
<Tbody>
<Tr> <font size = 4> <font color = #990033> </font>
<TD style = "border-Right: 2px solid; padding-Right: 1px; border-top: 2px solid; padding-left: 1px; padding-bottom: 1px; border-left: 2px solid; line-Height: 20px; padding-top: 1px; border-bottom: 2px solid "bordercolor = #99 CCFF bgcolor = #000000 colspan = 2 Height = 393>
<P style = "margin-top:-5px; margin-bottom:-5px; line-Height: 100%">
<Marquee scrolldelay = 100 ction = up Height = 393> </marquee> </P> <PRE style = "margin-top: 0px; margin-bottom: 0px; line-Height: 100% "> </font> </PRE> </TD> </tr> </tbody> </table>

------------------------------------------------------------

Basic syntax
<Marquee>... </marquee>

Text movement attribute settings

Direction

<Direction =#>#= left, right <marquee direction = left> shift from right to left! </Marquee>
Method

<Bihavior =###= scroll, slide, alternate <marquee behavior = scroll> go around in a circle! </Marquee>
<Marquee behavior = slide> just one stop! </Marquee>
<Marquee behavior = alternate> back and forth </marquee>

Loop

<Loop =#>#= number of times; if not specified, the loop is not limited to (infinite) <marquee loop = 3 width = 50% behavior = scroll> only go

3 </marquee>

<Marquee loop = 3 width = 50% behavior = slide> only take 3 </marquee>
<Marquee loop = 3 width = 50% behavior = alternate> only 3 trips! </Marquee>

Speed

<Scrollamount = #> <marquee scrollamount = 20> La la! </Marquee>

Latency

<Scrolldelay = #> <marquee scrolldelay = 500 scrollamount = 100> La la! Let's take a step and stop it!

</Marquee>

Layout settings

Align)

<Align =#>#= top, middle, bottom <font size = 6>
<Marquee align = # width = 400> La la, I will move it! </Marquee>
</Font>

Background Color

<Bgcolor = #>#= rrggbb hexadecimal digital, or the following predefined colors:
Black, Olive, teal, red, blue, maroon, navy, gray, lime,
Fuchsia, white, green, purple, silver, yellow, Aqua <marquee bgcolor = aaaaee> color! </Marquee>

Area

<Height = # width =#> <marquee Height = 40 width = 50% bgcolor = aaeeaa> area! </Marquee>

Blank

(Margins) <Marquee hspace = 20 vspace = 20 width = 150 bgcolor = ffaaaa align = center> area! </Marquee>

<Marquee direction = up> I am going up! </Marquee>
<Marquee direction = down> I moved down again </marquee>

Add a seamless loop Rolling

<HTML>
<Head>
</Head>
<Body>
<TD width = 390 Height = 99> <marquee scrollamount = 4 scrolldelay = 0 loop = 1 width = 390 Height = 99>
<Script language = JavaScript>
For (t = 1; t <= 1000; t ++)
Document. Write ("11111111111112222222222222222233333333333333 ")


</SCRIPT>
</Marquee> </TD>
</Body>
</Html>

Another method for achieving seamless connection and circular scrolling

<Div style = overflow: hidden; Height: 100px width: 100px>
<Div href = "#" target = "_ blank">

Width = "80" Height = "80"

Border = "0"> </a>

<A href = "#" target = "_ blank">

Width = "80" Height = "80"

Border = "0"> </a>

<A href = "#" target = "_ blank">

Width = "80" Height = "80"

Border = "0"> </a>

<A href = "#" target = "_ blank">

Width = "80" Height = "80"

Border = "0"> </a>

<A href = "#" target = "_ blank"> nudeangel_2 </a>

<A href = "#" target = "_ blank"> nudeangel_3 </a>

<A href = "#" target = "_ blank"> nudeangel_4 </a>

<A href = "#" target = "_ blank"> nudeangel_5 </a>

<A href = "#" target = "_ blank"> inudeangel_6 </a>

<A href = "#" target = "_ blank"> nudeangel_7 </a>

</Div>
<Div T = demo. scrolltop
Demo2.innerhtml = demo1.innerhtml
Function nudeangelmarquee (){
If (demo2.offsettop-demo. scrolltop <= 0)
Demo. scrolltop-= demo1.offsetheight
Else
Demo. scrolltop ++
}
VaR repeat = setinterval (nudeangelmarquee, 50 );
Demo. onmouseover = function () {clearinterval (Repeat );}
Demo. onmouseout = function () {repeat = setinterval (nudeangelmarquee, 50 );}

-----------------------------------------------------------

<Marquee> <bihavior =#># = scroll, slide, and alternate <marquee behavior = scroll> walk around in a circle! </Marquee>

The simplest special image movement effect-the horizontal movement of the image to the left
: <Marquee>










</Marquee>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.