Introduction to html marquee tag usage examples_HTML/Xhtml_Web page production-HTML Tutorial-php.cn

This tag is not part of HTML3.2, and only supports MSIE3 and later kernels, so if you use a non-IE browser (such as Netscape) you may not be able to see some of the following interesting effects
This tag is a container tag

Marquee announcement scrolling code

The simplest website announcement scrolling code, based on Marquee revolving lantern, scrolling vertically upwards, in Table form, can be used even if you don’t know CSS.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Announcement scrolling JS code</title>
<script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script>
</head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div>
<body>
<div align="center">
<table border="1" width="206" cellspacing="0" cellpadding="0" style="border-collapse: collapse" height="90" id="table1">
<tr>
<td valign="top"><MARQUEE onmouseover=this.stop() onmouseout=this.start() scrollAmount=1 scrollDelay=100 direction=up height="99%">
 <TABLE cellSpacing=0 cellPadding=0 width="95%" align=center border=0>
     <TBODY>
      <TR>
        <TD vAlign=top height=120>
           <P style="LINE-HEIGHT: 150%;font-size:9pt"><FONT color=#000033>·<A href="#" >Welcome! </A></FONT>
<FONT color=#000033>·<A
href="#">More script codes from Script House...</A></FONT>
<FONT color=#000033>·<A
href="#">A learning source code website... </A></FONT>
<FONT color=#000033>·<A href="#">If you have any suggestions, please submit them to us... </A></FONT>
<FONT color=#000033>·<A href="#">Thank you very much for your frequent visits</A></FONT>
<FONT color=#000033>·<A href="#">Thank you again and goodbye</A></FONT>
</TD></TR></TBODY></TABLE></MARQUEE></td>
  </tr>
 </table>
</div>
</body>
</html>

Tip: You can modify part of the code before running

Syntax:

< ;/marquee>

The following is the simplest example:

The code is as follows:

Copy code

The code is as follows:

Hello, World

The following two events are often used:

onMouseOut="this.start()": used to set the mouse to continue scrolling when it moves out of the area
onMouseOver="this.stop()" : Used to set the mouse to stop scrolling when the mouse moves into this area

The code is as follows:

Copy code

Code As follows:

onMouseOut="this.start()": used to set the mouse to move out of the Continue scrolling in the area onMouseOver="this.stop()": used to set the mouse to stop scrolling when the mouse moves into the area

This is a complete example:

The code is as follows:

Copy code

The code is as follows:

This is a complete example

This tag supports up to 11 attributes:

align

Set the alignment of the tag content
absbottom: absolute bottom alignment (with g, p Align to the bottom of the letter)
absmiddle: absolute center alignment
baseline: bottom line alignment
bottom: bottom alignment (default)
left: left alignment
middle: middle alignment
right : right alignment
texttop: top line alignment
top: top alignment

The code is as follows:

Copy code

The code is as follows:

align="absbottom": Absolute bottom alignment (aligned with the lowest end of letters such as g, p, etc.).
align="absmiddle": Absolute center alignment.
align="baseline": Bottom line alignment.
align="bottom": Bottom alignment (default).
align="left": Left aligned.
align="middle": Middle alignment.
align="right": Right aligned.
align="texttop": Top line alignment.
align="top": Top alignment.

behavior

Set the scrolling method:

alternate: means scrolling back and forth between the two ends.
scroll: means scrolling from one end to the other, and will be repeated.
slide: means scrolling from one end to the other without repetition.

The code is as follows:

Copy the code

The code is as follows:

alternate: Indicates scrolling back and forth between the two ends.
scroll: Indicates scrolling from one end to the other end and will repeat.
slide: Indicates scrolling from one end to the other without repetition.

bgcolor

Set the background color of active subtitles. The background color can be set in RGB, hexadecimal value format or color name.

The code is as follows:

Copy the code

The code is as follows:

Set the background color of active subtitles bgcolor="#006699"
Set the background color of active subtitles bgcolor="rgb(10%,50%,100%,)"
Set the background of active subtitles Color bgcolor="red"

direction

Set the scrolling direction of active subtitles

The code is as follows:

Copy code

The code is as follows:

Set the scrolling of active subtitles Direction direction="down": Down
Set the scrolling direction of active subtitles direction="left": To the left
Set the scrolling direction of active subtitles direction="right": right
Set the scrolling direction of active subtitles direction="up": Up

height

Set the height of the active subtitles

The code is as follows:

Copy code

The code is as follows:

Set the height of active subtitles height="500"

width

Set the width of active subtitles

code As follows:

Copy the code

The code is as follows:

Set the width of active subtitles width="500"

hspace

Set the distance between the position of the active subtitles and the horizontal border of the parent container

This controls the horizontal (horizontal) space around the display box.

The code is as follows:

Copy code

The code is as follows:

hspace= "100"

vspace

Set active subtitles The distance between the position and the vertical border of the parent container

This controls the vertical space around the display box.

The code is as follows:

Copy code

The code is as follows:

hspace="100"

loop

Set the number of times to scroll. When loop=-1 means scrolling all the time, the default is -1
The code is as follows:

Copy code

The code is as follows:

I will keep walking.

I only walked twice

scrollamount

Set the scrolling speed of active subtitles in pixels

The code is as follows:

Copy code

The code is as follows:

scrollamount="10"
< marquee scrollamount="20" >scrollamount="20"

scrollamount="30"

scrolldelay

Set the delay time between active subtitles scrolling twice, unit millisecond (millisecond)
A larger value will have the effect of a step-by-step pause

The code is as follows:

Copy code

The code is as follows:

scrolldelay= "10"
scrolldelay="100"
scrolldelay="1000" < ;/marquee>

Related labels：

html marquee

source：php.cn

Previous article：How to insert video into HTML and be compatible with all browsers_HTML/Xhtml_Web page production Next article：The width setting of the table cell td is invalid and the internal content is always stretched_HTML/Xhtml_Web page production

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn