The marquee element implements effects such as scrolling fonts and pictures

The marquee element implements effects such as scrolling fonts and pictures
The marquee element can achieve simple font (image, etc.) sliding and other effects:

Copy code
The code is as follows:

<style type="text/css">
#div01{
width: 500px;
}
</style>
<script type="text/javascript">
</script>
<marquee behavior="alertnate"><font size=30 color='red'>www.baidu.com111</font></marquee>
<marquee direction=right bgcolor='#ff2233' behavior="alertnate"><font size=30 color='blue'>www.baidu.com222</font></marquee>
<marquee id="m3" direction=down bgcolor='#dbdbdb' height=50px hspace=20px vspace=20px behavior="alertnate" scrollLeft=left onmouseover="this.stop()" onmouseout="this.start()"><font size=30 color='blue'>www.baidu333.com</font></marquee>
<marquee id="m4" direction=up bgcolor='#00dbdb' behavior="alertnate"><font size=30 color='blue'>www.baidu444.com</font></marquee>



<div id="div01"><marquee direction=right bgcolor='#ff2233' behavior="alertnate" scrolldelay=100><font size=30 color='blue'>www.baidu.com555</font></marquee></div>
<input type="button" onclick="m3.stop();" value="m3.stop"></input>
<input type="button" onclick="m3.start();" value="m3.start"></input>
<button onclick="m4.stop();">m4.stop</button>
<button onclick="m4.start();">m4.start</button>

direction indicates the scrolling direction. The values ​​can be left, right, up, down. The default value is left.
behavior indicates the scrolling mode. The value can be scroll (continuous scrolling), slide (slide once), alternate (scrolling back and forth).
loop indicates the number of loops, the value is a positive integer, the default is an infinite loop
scrollamount indicates the movement speed, the value is a positive integer, the default value is 6
scrolldelay indicates the pause time. The value is a positive integer. The default value is 0. The unit seems to be milliseconds.
align indicates the vertical alignment of the element. The value can be top, middle, bottom. The default value is middle.
bgcolor indicates the background color of the motion area. The value is a hexadecimal RGB color. The default value is white.
Height and width represent the height and width of the motion area. The value is a positive integer (in pixels) or a percentage. The default width is 100%. Height is the height of the element in the tag.
hspace and vspace represent the horizontal and vertical distances from the element to the region boundary. The values ​​are positive integers in pixels.
onmouseover=this.stop() onmouseout=this.start() means that scrolling stops when the mouse is above the area, and continues when the mouse is moved away.

The following is the setting for scrolling or stopping of m3 and m4 when the button is clicked:

Copy code
The code is as follows:

<input type="button" onclick="m3.stop();" value="m3.stop"></input>
<input type="button" onclick="m3.start();" value="m3.start"></input>
<button onclick="m4.stop();">m4.stop</button>
<button onclick="m4.start();">m4.start</button>

<<:  Implementation of mysql backup strategy (full backup + incremental backup)

>>:  25 fresh useful icon sets for download abroad

Recommend

Solution to MySQLSyntaxErrorException when connecting to MySQL using bitronix

Solution to MySQLSyntaxErrorException when connec...

MySQL 5.7 installation and configuration method graphic tutorial

This tutorial shares the installation and configu...

Complete list of CentOS7 firewall operation commands

Table of contents Install: 1. Basic use of firewa...

CSS sets the box container (div) height to always be 100%

Preface Sometimes you need to keep the height of ...

MySQL 8.0 user and role management principles and usage details

This article describes MySQL 8.0 user and role ma...

MySQL data table partitioning strategy and advantages and disadvantages analysis

Table of contents Why do we need partitions? Part...

Detailed explanation of the use of HTML header tags

HTML consists of two parts: head and body ** The ...

How to set up ssh password-free login to Linux server

Every time you log in to the test server, you alw...

Use Python to connect to MySQL database using the pymysql module

Install pymysql pip install pymysql 2|0Using pymy...

Talk about implicit conversion in MySQL

In the course of work, you will encounter many ca...

How to use Docker to build a development environment (Windows and Mac)

Table of contents 1. Benefits of using Docker 2. ...

How to optimize a website to increase access speed update

Recently, the company has begun to evaluate all s...

Is mysql a relational database?

MySQL is a relational database management system....

JavaScript to implement login slider verification

This article example shares the specific code of ...