A JavaScript Plugin for Creating a Ticker Board Effect

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'])

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.

Share