MARQUEE
TAG </>
The <marquee>
tag is an HTML element that was introduced in early versions of HTML to create
a scrolling or moving text or image effect on a webpage
Here's an
example of how the `<marquee>` tag is used:
Ø Direction change in marquee <tag>
· Right to left
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="left" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll from right to left-->
</body>
</html>
· Left to right
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="right" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll from left to right-->
</body>
</html>
· Bottom to up
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="up" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll bottom to up-->
</body>
</html>
· Up to bottom
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="down" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll up to bottom-->
</body>
</html>
Ø Behavior in
marquee movement
· SCROLL
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="right" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll left to right continuosly-->
</body>
</html>
· SLIDE
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="right" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll left to right Ones only and stop at the right side -->
</body>
</html>
· ALTERNATE
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
</head>
<body>
<marquee behavior="scroll" direction="right" background="red" >
<b>udit khode</b></marquee>
<!--this text will scroll left to right and right to left
continuously on the screen-->
</body>
</html>
In the
example above, the `behavior` attribute specifies the scrolling behavior
(options
include `scroll`, `slide`, or `alternate`)
and the `direction` attribute determines the
direction of the scrolling text
(`left`, `right`, `up`, or `down`).
NOTE : Instead of using the
`<marquee>` tag, it is recommended to use CSS animations or JavaScript to
achieve similar effects. CSS animations can be used to create scrolling or
moving elements, while JavaScript can provide more advanced control and
interactivity.
0 Comments