The component exposes a block named VanillaMarquee, with the following input parameters:

• CSS3Easing - A css3 transtion timing 'linear', 'ease', 'ease-in', 'ease-out'
• DelayBeforeStart - Time in ms before the marquee starts animating
• Direction - Direction towards which the marquee will animate 'left', 'right', 'up', 'down'
• Duplicated - Should the marquee be duplicated to show an effect of continuous flow. Use this only when the text is shorter than the container
• Duration - Duration in ms in which you want your element to travel
• Speed - Speed will override duration. Speed allows you to set a relatively constant marquee speed regardless of the width of the containing element. Speed is measured in pixels/second
• Gap - Gap in pixels between the tickers. Will work only when the duplicated option is set to true. Note: 20 means 20px so no need to use '20px' as the value.
• PauseOnHover - Pause the marquee on hover.
• StartVisible - The marquee will be visible from the start if set to true.
• RecalcResize - Should the marquee be updated on resize.

The following non-mandatory events are also exposed:

• BeforeStarting - Event will be fired on the element before animation starts.
• Finished - Event will be fired on the element on each iteration of the animation when it finishes.
• Paused - Event will be fired on the element when the animation is paused.
• Resumed - Event will be fired on the element when the animation is resumed.

Simply place the block in a page or block, set the input parameters accordingly, place your content inside the block's placeholder, and that's it !

You can play with the demo on the Try Now llink.