scroller
addobject.com
Continuous Scroll
NlsScroller Professional - Advanced HTML Scroller Control
Index  Next

Example below shows NlsScroller with continuous scroll. You can configure the scroller to scroll up, down, left and right. You can also set the speed, delay and scroll steps. If you specify delay > 0, the scroller will pause for the amount of times specified in delay property on each topic.

Happy New Year Everyone!
Monday January 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.Lorem ipsum dolor sit amet, consetetur sadipscing elitr

Click here for detail


Happy Valentine Everyone!
Wednesday, February 14th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 1
Thursday, March 15th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 2
Sunday, April 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 3
Tuesday, May 22nd, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Happy New Year Everyone!
Monday January 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.Lorem ipsum dolor sit amet, consetetur sadipscing elitr

Click here for detail


Happy Valentine Everyone!
Wednesday, February 14th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 1
Thursday, March 15th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 2
Sunday, April 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 3
Tuesday, May 22nd, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Happy New Year Everyone!
Monday January 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.Lorem ipsum dolor sit amet, consetetur sadipscing elitr

Click here for detail


Happy Valentine Everyone!
Wednesday, February 14th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 1
Thursday, March 15th, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 2
Sunday, April 1st, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail


Special Event 3
Tuesday, May 22nd, 2007

image Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Click here for detail

Below are scripts required to initialize the scroller on the left. No complicated javascript and the content are embeded directly in the page in a DIV element with id="scrollerDiv".

<div id="scollerDiv">contents here...</div>

<script>
  var n = new NlsScroller("scroll1");

  n.width=300;
  n.height=220;
  n.setEffect(new NlsEffContinuous("direction=up,speed=40,step=1,delay=0"));
  n.setContentById("scrollerDiv");
  n.render("scrollerDiv");
</script>

Note that NlsScroller Pro also supports dynamic content loading, you can loads content from separated file, database or RSS Feed from any websites using built-in AJAX functions. Check this features in later examples.

About the example:

  • The example above is configured to scroll automatically. It is possible to configure the scroller to scroll manually by default. You can also click on the mode button to toggle the scroll mode to auto/manual.
  • It is possible to show the toolbar.
  • Stop on Mouse Over is disabled.

Another continuous scroll example with delay:


NlsScroller Professional Demo
Copyright 2007 www.addobject.com.