Display RSS Feeds As A Horizontal Scroller – rss-marquee

Category: Javascript | July 15, 2020
Author:samuelcarreira
Views Total:4,356 views
Official Page:Go to website
Last Update:July 15, 2020
License:MIT

Preview:

Display RSS Feeds As A Horizontal Scroller – rss-marquee

Description:

A vanilla JavaScript library to display RSS feeds as a marquee-like horizontal scroller.

Supports multiple RSS feed sources. Smooth scrolling animations are based on CSS3 transforms.

How to use it:

1. Create a container to hold the RSS Marquee.

<div id="marquee"></div>

2. Load the rss-marquee.js at the end of the document.

<script src="rss-marquee.js"></script>

3. Specify an array of RSS feed sources as follows:

const feedUrl = [
      'https://www.cssscript.com/feed/',
      '2.xml',
      '3.xml',
      // ...
];

4. Initialize the library and done.

const elementSelector = document.getElementById('marquee');
new RSSMarquee(feedUrl, elementSelector, {
    // options here
});

5. Determine the scrolling speed. Bigger values = slow speed.

new RSSMarquee(feedUrl, elementSelector, {
    speed: 110
});

6. Determine the maximum number of entries per RSS feed source. Default: null.

new RSSMarquee(feedUrl, elementSelector, {
    maxItems: 5
});

7. Determine the selector of the element where you want to show the URL of the news feed source (usefull for copyright atttribution).

new RSSMarquee(feedUrl, elementSelector, {
    hostnameSelector: null
});

You Might Be Interested In:


One thought on “Display RSS Feeds As A Horizontal Scroller – rss-marquee

  1. Fabrizio Batolomucci

    It is nice and working seamlessly. Too bad the texts are presented, but it is impossible to click on them to get to the blog page! You may check at the top of the inserted website.

    Reply

Leave a Reply