svelte-news-ticker Svelte Themes

Svelte News Ticker

news-ticker

Usage

via CDN

<!doctype html>
<html class="no-js" lang="en">
<head>
...
<body>
  <div class="news-wrapper">
    <news-ticker id="flash-news" duration=5>
      <p>...First news</p>
      <p>Second news with a <a href="https://google.com">link</a></p>
      <p>And possibly of course, some "<strong>colors</strong>" like <span style="color:red;">red</span> or <span style="color:lime">lime</span>!</p>
    </news-ticker>
  </div>
...
  <script src="https://cdn.jsdelivr.net/npm/@tigersway/[email protected]"></script>
</body>
</html>

via npm/pnpm/yarn

... and your bundler!

import '@tigersway/news-ticker';

Options

  • id: CSS id selector, needed if you have more than 1 news-ticker on the same page,
  • duration: (default 6) Number of seconds between flips.

CHANGELOG

  • v1.0.2

    • Added small right margin on the news
  • v1.0.0

    • First public release

Top categories

Loading Svelte Themes