HTML Slide-In Text

This page contains HTML code for creating slide-in text. It is recommended that you use CSS Slide—In Text instead. However, if you have reason not to use CSS, then read on.

You can create slide-in text — or zoom in text — in HTML using <marquee> tags. You can make your text slide in from the left, right, top, or bottom.

Note: Due to the nature of slide-in text, you may need to refresh this page several times to catch all of the examples. This is because, once the text has slid in, it stops. If you don't see it slide in, you've missed it... unless you reload the page!

Top to Bottom

To make your text slide in from the top, use behavior="slide" direction="down". Like this:

Bottom to Top

To make your text slide in from the bottom, use behavior="slide" direction="up". Like this:

Right to Left

To make your text slide in from the right, use behavior="slide" direction="left". Like this:

Left to Right

To make your text slide in from the left, use behavior="slide" direction="right". Like this:

Changing the Speed

You can speed up your slide-in text - or slow it down if you prefer. To do this, just add the scrollamount attribute. For example, scrollamount="1" results in a very slow slide, while scrollamount="50" will make the text zoom-in - perhaps too fast for most people to notice it zooming in.

Some examples:

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:

• HTML Marquee
• CSS Marquee
• Scrolling Text
• Slide-In Text
• Bouncing Text
• Scrolling Image
• Slide-In Image
• Bouncing Image

Marquee Generator

Also check out the Marquee Generator.

Marquee Usability

Try to be careful when using HTML marquees. Many web users dislike websites that contain scrolling or bouncing images and other elements, so try to use them tastefully :)