Thursday, December 19, 2013

Special Effects >> Special Effects - Marquee Tag- (PART_18)

Topic: How to set the marquee scrolling speed?
           Marquee behavior!
           Make scrolling image?


Explanation:

Attribute: behavior
This sets the background color for marquee path.
It takes values SCROLL or SLIDE or ALTERNATE

Example Code:

<marquee bgcolor=orange width=200 height=20 direction=right behavior=alternate> Moving Text</marquee>

Result:
Moving Text 

Attribute: scrollamount
This controls the amount of movement (in pixels) between the successive displays that give the impression of animation.

Example Code:

<marquee bgcolor=orange width=200 height=20 direction=right behavior=alternate scrollamount=5> Moving Text Tag </marquee>

Result with scrollamount as 5:
Moving Text Tag

Result with scrollamount as 50:
Moving Text Tag 

Attribute: srolldelay
This controls the delay (in milliseconds) between the successive displays that give the impression of animation.

Example Code:

<marquee bgcolor=orange width=200 height=20 direction=right behavior=alternate scrolldelay=5> Scrolling Text Tag </marquee>

Result with scroll delay as 5:
Scrolling Text Tag
Result with scroll delay as 500:
Scrolling Text Tag 

Moving Image
Similarly image can be moved. Instead of text in between marquee tags give an image. It will scroll/move

Example Code:

<marquee width=100 height=20> <img src="./test.jpg"> </marquee>

Result: Scrolling Images