HTML5 scrolling text

HTML5 will not support scrolling text (marquee), marquee is obsolete. There is no marquee element defined since HTML 4.01 specification.

This article will answer how to make animated scrolling text within HTML5.

One way is to use jQuery marquee plugin. In next section you will find simple guide how to make animated scrolling text effect like marquee with jQuery.

Animated scrolling text with jQuery Demo:

Demo for marquee scrolling right

Animated scrolling text with jQuery code:

 <script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js" type="text/javascript"></script>
  <script src="http://remysharp.com/downloads/jquery.marquee.js" type="text/javascript"></script>

<marquee behavior="scroll" direction="right" scrollamount="2" width="350"><p>Demo for marquee scrolling right</p></marquee>

So to have scrolling text effect in HTML5 you need to:

• reference on jquery-1.3.2.min.js and jquery.marquee.js files


• add a marquee HTML element

In Marquee HTML element you can adjust attributes such as:

• direction - left, right, up and down


• scrollamount - speed of scrolling


• behaviour - such as slide, scroll and alternate


• width

You can find jquery.marquee.js file.

In the end you have marquee like animated scrolling effect which you can use in HTML5.

Here you can find more cool javascript effects tutorials.