About Us      |    Site Map    |     Home                     
   
Help Center Shopping Cart  
Contact Hosting Services  
 
Services
Website Design
Programming
E-Commerce
Flash
GeoDesic
Drupal
Linux
 













Here is the world's simplest and easiest to deploy Javascript Content Scroller, Vertical or Horizontal Javascript Content Scroller Script

AUTHOR: Frank Koenen
TYPE: Freeware
BROWSERS: IE 5, IE 6, NS 6+, FireFox, Opera 6+

With this well designed object oriented cross browser script you can deploy one or multiple content scrollers on a single page. Simple setup and configuration.

change from horizontal to vertical scroll and choose to pause scroller on mouse over or to leave it running. Scroller items can be a link or plain text.

Key features:

  • Change from horizontal to vertical scroll

  • Choose to pause scroller on mouse over.

  • Scroller items can be any HTML content you like.

  • Can be used in any HTML context.

  • Easy to configure.

  • Control speed and other dimensions of the scroller.



Download here for free.

If you find this script useful, please donate: $5.00






EXAMPLE






HOW TO USE
1) Insert this script in the section of the page.

<script src="contentscroller.js" language="JavaScript" type="text/javascript"></script>

2) Create a host element on your page to locate the placement of the scroller:

<div id="elementtoscrollcontentof"></div>

3) Create an Javascript object instance of the scroller assigning the DOM element to host the scroller. And provide content to scroll:

<script>
    window.myscroller = new ContentScroller(
    { myname: 'window.myscroller',
    containerid:'elementtoscrollcontentof'
    }
    );

    var articles = new Array();
    articles.push({displayhtml:"Welcome to Frank's world 1."});
    articles.push({displayhtml:"Welcome to Frank's world 2.", id:null});
    articles.push({displayhtml:"Welcome to Frank's world 3.", id:"testid"});
    articles.push({displayhtml:"Welcome to Frank's world 4."});
    window.myscroller.Items = articles;
  </script>


4) Using your preferred method, create an onLoad event handler to start the scroller, examples:

<body onLoad="window.myscroller.start()"

or, using a portable attach event inside a <script> tag on the page ...

<script>

    if (window.addEventListener) window.addEventListener ("load",function(event) {window.myscroller.start();},false);
    else if (window.attachEvent) window.attachEvent ("onload",function(event) {window.myscroller.start();});
  </script>


To configure otherwise, see these settings on the object instance (this. is the object):
   // Width of entire scroller.
   this.scrollerwidth = 350;

   // Height of Scroller.
   this.scrollerheight = 25;

   // Pause the scroller on mouseOver. (use 0 for no.)
   this.pause = true;

   // Orientation of scroller, one of: horizontal or vertical
   this.orientation = "horizontal";

   // increase this to reduce loop resets to merit a smoother scroller.
   this.smoothfactor = 4;

   // The number of Pixels to move by. Lower number merits a smoother, slower scroll. (1..100)
   this.moveby = 1;

   // time in MS to re-trigger movement, eg: scroller speed. (smaller value :== faster scroll)
   this.speed = 25;
Contact
11115 Margaret Way, Flagstaff, AZ 86004