scroller
addobject.com
Slide Effect
NlsScroller Professional - Advanced HTML Scroller Control
   

Example below shows NlsScroller Pro with sliding effect. NlsScroller pro supports 3 sliding effect: shift or push, slide in and slide out. You can configure the scroller to slides the content up, down, left and right. speed, steps are also available.

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".

<script>
  var n = new NlsScroller("scroll1");
  n.setContentById("scrollerDiv");
  n.width=280;
  n.height=200;
  n.speed=3000;
  n.showToolbar=true;
  n.setEffect(new NlsEffSlide("type=shift,direction=up,speed=10,stepsnum=40"));
  n.render("scrollerDiv");
</script>

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 hide the toolbar.

More slide effect examples:

  • Slides In. Content slides in from top, bottom, left and right.
  • Slides Out. Content slides out to top, bottom, left and right.