HTML Marquee Text Start/Stop Examples
Definition
-
HTML <marquee> tag use to create a scrolling text as well as you assign click, hover and button effect to control start/stop marquee text/image. Lets see following some example.
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>
Marquee Start/Stop Buttons
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left" id="marquee1"><p>Press Button</p></marquee>
<input type="button" value="Stop Marquee" onClick="document.getElementById('marquee1').stop();"/>
<input type="button" value="Start Marquee" onClick="document.getElementById('marquee1').start();"/>
</body>
</html>
Multiple Start/Stop Marquee
<html>
<head>
</head>
<body>
<marquee behavior="scroll" direction="left" scrollamount="10" id="marquee2"><p>Marquee 1</p></marquee>
<marquee behavior="scroll" direction="left" scrollamount="15" id="marquee3"><p>Marquee 2</p></marquee>
<input type="button" value="Stop Marquee 1" onClick="document.getElementById('marquee2').stop();"/>
<input type="button" value="Start Marquee 1" onClick="document.getElementById('marquee2').start();"/><br />
<input type="button" value="Stop Marquee 2" onClick="document.getElementById('marquee3').stop();"/>
<input type="button" value="Start Marquee 2" onClick="document.getElementById('marquee3').start();"/>
</body>
</html>
Marquee Examples |
---|
Marquee Slow Fast Text Examples |
Marquee Falling Text Examples |
Marquee Text Examples |
Marquee Image Examples |
Use our Marquee code generator HTML Marquee Image Code Generator