Ticker-board is a JavaScript plug-in for creating a stock palette effect that simulates the effect of split text just like an airport split departure board and is fully accessible to screen readers.
How to make use of it:
1. Import the Ticker Board’s JavaScript and Stylesheet into the doc.
<link rel="stylesheet" href="src/ticker.css" /> <script src="src/ticker.js"></script> <script src="src/index.js"></script>
2. Initialize the Ticker Board on the container component whose interior text must be rotated through:
<p class="create-ticker"> <span>A JS plugin</span> <span>for ticker boards</span> </p> <ul class="create-ticker"> <li>Vanilla JS</li> <li>CSS included</li> <li>Auto rotating board</li> <li>Manual update API</li> <li>That's all so far</li> </ul>
new TickerBoard('.create-ticker')
3. Update the Ticker Board.
board.updateMessages(['Apple', 'Banana', 'Cherry'])
Read More - A Simple and Smooth jQuery Newsticker Plugin | eocjsNewsticker
Advantages
- Vanilla JS, so can be used with any framework
- Webpack minified
- Node module available
- Good performance thanks to
window.requestAnimationFrame
Disadvantages
- Could be typescript
- Low on documentation
Split Flap Text Effect, ticker-board Plugin/Github, jquery flapper, split-flap display simulator
See Demo And Download
Official Website(rjkerrison): Click Here
This superior jQuery/javascript plugin is developed by rjkerrison. For extra advanced usage, please go to the official website.