8. Dynamic Content and RSS Scrolling

NlsScroller supports loading content dynamically for example from static file, server, database or RSS. Content is loaded using AJAX, no browser refresh needed. You can also specify amount of time for the scroller to reload/refresh the content. Below are steps to implement dynamic content.

1. Includes the Script Files and Stylesheet

In addition to main script file and stylesheet, you have to include nlsscroller_dyn.js in the page.


        <html>
<head>
<title>Embeding NlsScroller</title> <link rel="StyleSheet" href="nlsscroller/nlsscroller.css" type="text/css" /> <script language="javascript" src=" nlsscroller/nlsscroller.js"></script> <script language="javascript" src=" nlsscroller/nlsscroller_dyn.js"></script> </head>
</html>

2. Specifies Container for the scroller

Since the content is loaded dynamically, you only need to specify empty container for the scroller.

        <div id="scrollerDiv"></div>
      

3. Creates the Scroller
        1. <script>
        2.   var n = new NlsScroller("scroll1");
        3.   n.width=300;
        4.   n.height=220;
        5.   n.setEffect(new NlsEffContinuous("direction=up,speed=40,step=1,delay=0"));
        7.   n.render("scrollerDiv"); 
        8.   n.loadDynamicContent("content.htm");
        9. </script>
      

Please note that the content is loaded after render() function is called. Content is loaded using loadDynamicContent() function. You will need to specify the url of the content file. It can be static html file or server side page. With server side page you can load content from database or other resources.

As usual the content is HTML (well form) with special tag as topic separator (Please check Implementation for further detail).

          <span class="nlsscrollerbreak"></span>
        

The loadDynamicContent() function has another parameter which specify the amount of time (in milliseconds) for the scroller to reload/refresh the content.

          n.loadDynamicContent("laodfromdatbase.php", 60000);
        
The example above reloads/refreshes the contents of the scroller every 60 seconds.



4. Scrolls RSS Feed!

With dynamic content mechanism, it is possible for the scroller to scroll RSS Feed. NlsScroller provides RSS Feed handler that loads RSS Feed. The RSS Feed which is actually XML is parsed and converted into HTML suitable for scroller. Below is the example code to loads RSS into scroller:

        1. <script>
        2.   var n = new NlsScroller("scroll1");
        3.   n.width=300;
        4.   n.height=220;
        5.   n.setEffect(new NlsEffContinuous("direction=up,speed=40,step=1,delay=0"));
        7.   n.render("scrollerDiv"); 
        8.   n.loadDynamicContent(
               "loadfromrss.php?fname=http://www.myserver.com/rssurl"
             );
        9. </script>
      

As you can see in the example above, loadfromrss.php handler is used to load RSS Feed from specified url. The loadfromrss.php requires an input fname which is the address of RSS Feed. NlsScroller also provides RSS Feed handler in ASP. You can also creates your own handler in other language.