Stop Marquee with Images Code

Example Code


<!-- Codes by HTMLmagics-->
<marquee behavior="scroll" direction="right" scrollamount="50" id="mymarquee2">
<p>See how fast I am!</p>
</marquee>
<img src="http://www.htmlcodes.me/images/marquees/stop_marquee.png" width="100" height="100" alt="Stop button" onClick="document.getElementById('mymarquee2').stop();" />
<img src="http://www.htmlcodes.me/images/marquees/start_marquee.png" width="100" height="100" alt="Start button" onClick="document.getElementById('mymarquee2').start();" />
<p><a  style="font-size:11px;color:#999;" href="http://www.tmlmagics.blogspot.com/marquees/stop-marquee.cfm">Pause marquee</a></p>


Result

See how fast I am!

Pause marquee

Stop Marquee with Buttons

Example Code


<!-- Codes by HTMLmagics-->
<marquee behavior="scroll" direction="left" scrollamount="50" id="mymarquee">
<p>See how fast I am!</p>
</marquee>
<input type="button" value="Stop Marquee" onClick="document.getElementById('mymarquee').stop();">
<input type="button" value="Start Marquee" onClick="document.getElementById('mymarquee').start();">
<p><a  style="font-size:11px;color:#999;" href="http://wwwhtmlmagics.blogspot.com/marquees/stop-marquee.cfm">Pause marquee</a></p>


Result

See how fast I am!

Pause marquee

Stop & Start Marquee on Click

Example Code


<!-- Codes by HTMLmagics -->
<marquee behavior="alternate" scrollamount="30" onmousedown="this.stop();" onmouseup="this.start();">Catch me if you can!</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://www.htmlmagics.blogspot.com/marquees/stop-marquee.cfm">Pause marquee</a></p>


Result

Catch me if you can!
Pause marquee

Stop Marquee on Hover

Example Code


<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="right" onmouseover="this.stop();" onmouseout="this.start();">Go on... STOP ME!</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://www.htmlcodes.me/marquees/stop-marquee.cfm">Pause marquee</a></p>



Result

Go on... STOP ME!

Pause marquee

Images and Text

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="left">
<div style="text-align:center;">
<img src="http://www.htmlcodes.me/images/marquees/flying_bat.gif" width="125" height="82" alt="Flying bat in a marquee" /><br />Bruce the Bat
</div>
</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

HTMLmagics

Scrolling Images

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="left"><img src="http://www.htmlcodes.me/images/marquees/flying_bat.gif" width="125" height="82" alt="Flying bat in a marquee" /></marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

Marquee Speed

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="right" scrollamount="10">Hare</marquee>
<marquee behavior="scroll" direction="right" scrollamount="5">Tortoise</marquee>
<marquee behavior="scroll" direction="right" scrollamount="1">Snail</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

Html
Magic
MTMLmagics

Bouncing Marquee Code

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="alternate" direction="left">Your bouncing marquee text goes here</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

Your bouncing marquee text goes here

Slide-in Marquee Code

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="slide" direction="left">Your marquee (slide-in) text goes here</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

Your marquee (slide-in) text goes here

Vertical Marquee Code

Continuous Scrolling Marquee Code

Example Code

 

<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="up">Your vertically scrolling marquee text goes here</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

Result

 

 

 

 

Your vertically scrolling marquee text goes here

Horizontal Marquee -

Continuous Scrolling Marquee Code

Example Code

<!-- Codes by HTMLmagics -->
<marquee behavior="scroll" direction="left">Your left scrolling marquee text goes here</marquee>
<p><a  style="font-size:11px;color:#999;" href="http://htmlmagics.blogspot.com/marquees/marquee-codes.cfm">HTML for marquees</a></p>

 

Result

Your left scrolling marquee text goes here