Marquee Label (marquee)

Source: Internet
Author: User
Tags set background

Reprinted from http://blog.csdn.net/lanvia/article/details/1633755

In the default editing state of the forum, we can move the object through the UBB syntax of move and fly statements, but the function is simple, just moving in parallel. And we use HTML's marquee statement to produce more moving effects: Left, right, up, down. Nested using the marquee statement, the effect is even richer.

Marquee Basic Grammar:<marquee> ... </marquee>

Description: As with most HTML syntax elements, it is also a double occurrence, and the decorated object is placed between the start and end characters. Consider the following example:

<marquee> la La, really can move yes! </marquee>

Cheer up, it's really going to move!

Look, easy, huh? However, the above example only uses the default usage of marquee. When we add the corresponding parameters, the method of moving it is different.

Parameter one: direction. Direction's English means direction. There are four values for this parameter: left, right, up (top), down (bottom).

Example: <marquee direction=up> Move Up </marquee>

Move Up

Parameter two: behavior. Move the way. Values: Scroll (circular movement), slide (one turn only), alternate (move back and forth).

Example: <marquee direction=left behavior=alternate> haha, I go back and forth! </marquee>

Haha, I go back and forth!

<marquee direction=left behavior=slide> Tired! I only go once! </marquee>

Tired! I only go once!

Parameter three: loop. Cycle. If not specified, the loop is more than (infinite) and its value is numeric. Cases:

<marquee loop=3> I only walk three times Oh </marquee>

I only walk three times.

Parameter four: ScrollAmount. Movement speed. The value takes a positive integer. The higher the value, the faster the speed. Cases:

<marquee scrollamount=25> See, how fast I go! </marquee>

Look, how fast I go!

Parameter five: scrolldelay

Delay. Numerical. Cases:

<marquee scrolldelay=1000> I'll take a walk, stop </marquee>

I'll take a walk and stop.

Parameter six: bgcolor

Background. Cases:

<marquee bgcolor=pink>, you see? Have a background! </marquee>

Did you see that? Have a background!

Parameter VII: Width and height. is the width and height of the move. Cases:

<marquee width=200 height=200 Bgcolor=pink direction=down> This area is not enough for me to move! </marquee>

This area is not enough for me to move!

Additional parameters: Blank (Margins)

In the examples we have shown in this section, the objects that marquee move are words, in fact, where the visual objects, as long as there is enough area, marquee can make them move.



Note. The label is not part of the HTML3.2 and only supports MSIE3 later, so if you use a non-IE kernel browser (such as: Netscape) You may not see some interesting effects
The label is a container label
Grammar:

<marquee></marquee>
Here is one of the simplest examples:
The code is as follows:

<marquee><font size=+3 Color=red>hello, world</font></marquee>

The following two events are often used:
Onmouseout= "This.start ()": To continue scrolling when you set the mouse to move out of the area
Onmouseover= "This.stop ()": To stop scrolling when the mouse is moved into the area

The code is as follows:

<marquee onmouseout= "This.start ()" onmouseover= "This.stop ()" >onmouseout= "This.start ()": To continue scrolling when you set the mouse to move out of the area Onmouseover= "This.stop ()": To stop scrolling when the mouse is moved into the area </marquee>

This is a complete example:
The code is as follows:

<marquee id= "Affiche" align= "left" behavior= "scroll" bgcolor= "#FF0000" direction= "Up" height= "+" width= "200" Hspace= "vspace=" loop= "1" scrollamount= "scrolldelay=" "onmouseout=" This.start "onmouseover=" This.stop () ">
This is a complete example.
</marquee>


The label supports up to 11 properties:
Align
Alignment of settings <marquee> label content
Absbottom: Absolute Bottom Alignment (aligns with the lower end of the letters G, p, etc.)
Absmiddle: Absolute Central Alignment
Baseline: Bottom line Alignment
Bottom: Bottom alignment (default)
Left: Right-justified
Middle: Middle Alignment
Right: Justify
Texttop: Top Line alignment
Top: Alignment


The code is as follows:

<marquee align= "Absbottom" >align= "absbottom": Absolute bottom Alignment (aligns with the lower end of the letters G, p, etc.). </marquee>
<marquee align= "Absmiddle" >align= "absmiddle": absolute Central alignment. </marquee>
<marquee align= "Baseline" >align= "baseline": Bottom line Alignment. </marquee>
<marquee align= "Bottom" >align= "bottom": Bottom-aligned (default). </marquee>
<marquee align= "left" >align= "Ieft": Justified. </marquee>
<marquee align= "Middle" >align= "middle": Middle alignment. </marquee>
<marquee align= "Right" >align= "R": Justified. </marquee>
<marquee align= "Texttop" >align= "Texttop": Align Top lines. </marquee>
<marquee align= "Top" >align= "top": Align the tops. </marquee>


Behavior
To set the scrolling mode:
Alternate: Indicates scrolling back and forth between the ends.
Scroll: Indicates that one end is scrolled to the other and is repeated.
Slide: Represents a scroll from one end to the other and does not repeat.

The code is as follows:

<marquee behavior= "Alternate" >alternate: means scrolling back and forth between the ends. </marquee>
<marquee behavior= "Scroll" >scroll: Indicates that scrolling from one end to the other is repeated. </marquee>
<marquee behavior= "Slide" >slide: Indicates that one end is scrolled to the other and does not repeat. </marquee>


BgColor
Sets the background color of the active caption, and the background color can be set by the format or color name of the RGB, 16 binary values.

The code is as follows:

<marquee bgcolor= "#006699" > Set the background color of active subtitles bgcolor= "#006699" </marquee>
<marquee bgcolor= "RGB (10%,50%,100%,)" > Set background color for active subtitles bgcolor= "RGB (10%,50%,100%,)" </marquee>
<marquee bgcolor= "Red" > Set the background color of active subtitles bgcolor= "Red" </marquee>


Direction
Set the scrolling direction of active captions

The code is as follows:

<marquee direction= "Down" > Set scrolling Direction direction= "down" for active captions: down </marquee>
<marquee direction= "Left" > Set the scrolling direction of active subtitles direction=
<marquee direction= "Right" > Set the scrolling direction of the active caption direction= "OK": Rightwards </marquee>
<marquee direction= "Up" > Set scrolling Direction direction= "up" for active captions: up </marquee>


Height
Set the height of the active caption

The code is as follows:
<marquee height= "direction=" "Down" bgcolor= "#CCCCCC" > Set the height of active subtitles height= "$" </marquee>


Width
Set the width of the active caption

The code is as follows:
<marquee width= "$" bgcolor= "#CCCCCC" > Set the width of the active caption width= "page" </marquee>

Hspace
Sets the distance from the horizontal border of the parent container where the active caption is located
This controls the horizontal (level) space around the display box.

The code is as follows:

<table width= "border=" 1 "align=" center "cellpadding=" 0 "cellspacing=" 0 ">
<tr>
<td><marquee hspace= "bgcolor=" #CCCCCC ">hspace=" </marquee></td>
</tr>
</table>


Vspace
Sets the distance from the vertical border of the parent container where the active caption is located
This controls the vertical (vertical) space around the display box.

The code is as follows:
<marquee vspace= "bgcolor=" #CCCCCC ">hspace=" </marquee>

Loop
Set the number of scrolls, when loop=-1 means scrolling down, the default is-1

The code is as follows:

<marquee loop= "-1" bgcolor= "#CCCCCC" > I'm going to keep going. </marquee>
<p>&nbsp;</p>
<marquee loop= "2" bgcolor= "#CCCCCC" > I only go two times Oh </marquee>


ScrollAmount
Set the scrolling speed of the active caption, unit pixels

The code is as follows:

<marquee scrollamount= "Ten" >scrollamount= "ten" </marquee>
<marquee scrollamount= ">scrollamount=" </marquee>
<marquee scrollamount= ">scrollamount=" </marquee>


Scrolldelay
Set the delay time between active caption scrolling two times, unit millisecond (milliseconds)
When the value is large, there will be a pause in the effect.

The code is as follows:

<marquee scrolldelay= "Ten" >scrolldelay= "ten" </marquee>
<marquee scrolldelay= "> scrolldelay=" </marquee>
<marquee scrolldelay= ">scrolldelay=" </marquee>

Marquee Label (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.