Simple image animation in HTML by using marquee tag, Free online HTML Tutorial, Learn HTML online for free...

Image marquee works in the same way as the text marquee does. The same marquee tag is used to scroll the image. However we replace the text with the 'img' tag. Let's see how it works:

Start Tag: <marquee>
End Tag: </marquee>

Simple Image scrolling:

<marquee><img src="logo.jpg"></marquee>
The above markup results in the following output:

Scrolling Image in both directions (alternatively):

<marquee behavior="alternate"><img src="logo.jpg"></marquee>
The above markup results in the following output:

The value of behavior attribute i.e. alternate causes the image to scroll in both directions, alternatively.

Changing the background color of the MARQUEE:

<marquee bgcolor="pink"><img src="logo.jpg"></marquee>
The above markup results in the following output:

The value of the bgcolor attribute determines the background color of the MARQUEE. A complete color list can be found here.

Next >>> Lesson No. 29: Advanced Image Animation