Scrolling Text

This page contains HTML code for creating scrolling text.

You can create scrolling text in HTML using <marquee> tags. You can make your text scroll from right to left. You can make it scroll left to right. You can make it bounce back and forth. You can make it scroll up or down. You can even make your text zoom in from the side and stay in the same place.

Right to Left

To make your text scroll left (i.e. from right to left), use behavior="scroll" and direction="left". Like this:

Source Code	Result
<!-- Codes by HTML.am --> <marquee behavior="scroll" direction="left">Here is some scrolling text... right to left!</marquee>	Here is some scrolling text... right to left!

Left to Right

To make your text scroll right (i.e. from left to right), use behavior="scroll" and direction="right". Like this:

Source Code	Result
<!-- Codes by HTML.am --> <marquee behavior="scroll" direction="right">Here is some scrolling text... left to right!</marquee>	Here is some scrolling text... left to right!

Scroll Up

To make your text scroll up (i.e. from bottom to top), use behavior="scroll" and direction="up". Like this:

Source Code	Result
<!-- Codes by HTML.am --> <marquee behavior="scroll" direction="up">Here is some scrolling text... going up!</marquee>	Here is some scrolling text... going up!

Scroll Down

To make your text scroll down (i.e. from top to bottom), use behavior="scroll" and direction="down". Like this:

Source Code	Result
<!-- Codes by HTML.am --> <marquee behavior="scroll" direction="down">Here is some scrolling text... going down!</marquee>	Here is some scrolling text... going down!

Speed

You can change the scrolling speed of your marquee. For example, scrollamount="1" sets the marquee to a very slow scroll, while scrollamount="20" will make it faster. You can use whatever number you like though. Like this:

Source Code	Result
<!-- Codes by HTML.am --> <marquee behavior="scroll" direction="left" scrollamount="1">Very slow...</marquee> <marquee behavior="scroll" direction="left" scrollamount="10">Faster...</marquee> <marquee behavior="scroll" direction="left" scrollamount="20">Fast...</marquee> <marquee behavior="scroll" direction="left" scrollamount="50">Lightning!</marquee>	Very slow... Faster... Fast... Lightning!

Usability of Marquees

You should be careful when using marquees in HTML. Many web users dislike websites that contain scrolling text and other elements, so try to use them tastefully :)

Also note that the <marquee> tag is not part of the official HTML specification. Having said that, it is recognized by most major browsers.

More Marquee Codes

You can do much more with HTML marquees than is covered on this page. Here's the full list of marquee codes on this website:

• Scrolling Text
• Slide-In Text
• Bouncing Text
• Scrolling Image
• Slide-In Image
• Bouncing Image