HTML Marquee Tag
Definition
HTML <marquee> tag use to create a scrolling text or scrolling image from left to right, right to left, top to bottom, bottom to top. There is no limit. It's user define choice.
<marquee> tag is a container tag to create scrolling text.
<marquee> tag support following some attributes. This attributes use to add more special effect and easy control.
Attributes | Values | Description |
|---|---|---|
| behavior | "slide" "scroll" "alternate" | Start completely and stop as soon as text touches the margin. Start completely and off one side. Text bounce as soon as touch both side margin. |
| bgcolor | "color code" | Specifies the background color. |
| direction | "left" "right" "up" "down" | Left to Right Right to Left Bottom to Top Top to Bottom |
| width | "size" | Specifies width in marquee. |
| height | "size" | Specifies height in marquee. |
| loop | "2" "infinite" | Loop Continues in limited times. Loop Continues in Infinite. |
| scrollamount | "3" | Specifies Speed to scroll on the text. |
| scrolldelay | "3" | Specifies time wait long before each marquee. |
| hspace | "size" | Specifies left or right margin for outside marquee. |
| vspace | "size" | Specifies top or bottom margin for outside marquee. |
Side Touch Margin Bounce Text
<html> <head> </head> <body> <marquee behavior="alternate" direction="left">Side Touch Margin Bounce Text</marquee> </body> </html>
Upside Text Scrolling
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="up">Upside Text Scrolling</marquee>
</body>
</html>Marquee Text Scrolling Speed
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left" scrollamount="3">Slow speed scroll speed</marquee>
<marquee behavior="scroll" direction="left" scrollamount="10">Medium speed scroll speed</marquee>
<marquee behavior="scroll" direction="left" scrollamount="17">Fast speed scroll speed</marquee>
</body>
</html>Side Touch Margin Bounce Image
<html>
<head>
</head>
<body>
<marquee behavior="alternate" direction="left">
<img src="../images/img_nat.png" width="120" height="80" alt="Natural" />
</marquee>
</body>
</html>Upside Image Scrolling
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="up">
<img src="../images/img_nat.png" width="120" height="80" alt="Natural" />
</marquee>
</body>
</html>Change the Image Scrolling Speed
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left" scrollamount="5">
<img src="../images/img_nat.png" width="120" height="80" alt="Natural" />
</marquee>
<marquee behavior="scroll" direction="left" scrollamount="15">
<img src="../images/img_nat.png" width="120" height="80" alt="Natural" />
</marquee>
</body>
</html>Click and Hold to Stop Marquee
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left"
onmousedown="this.stop();"
onmouseup="this.start();">Click and hold the mouse marquee stop</marquee>
</body>
</html>
Hover to Stop Marquee
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left"
onmouseover="this.stop();"
onmouseout="this.start();">Hower over and hold the mouse marquee stop</marquee>
</body>
</html>
0 Reviews:
Post a Comment