Vertical Scroll Behavior

The purpose of this behavior is to build a vertical scroller using FP layers.

Download and Install

You can download the behavior here - once you've downloaded extract the 2 files (VerticalScroll.htm and VerticalScroll.js) to your
%userprofile%\Application Data\Microsoft\FrontPage\Behaviors\Actions folder - where %userprofile% is the file path to the Documents and Settings folder for the current Windows user.


If FP is open you'll need to close and restart it to enable the behavior. Once you've restarted the behavior will be available by choosing Format - Behaviors - Insert - Scroller - Vertical Scroller. The behavior will be greyed out unless you have at least 1 layer on your page.

The Interface

Most of the options here are self explanatory - we choose the layer to scroll then set speed and direction and choose whether or how the layer loops.

Layer to Scroll

Select the layer you wish to scroll from the drop down list - although you can scroll any layer in most cases you'd choose a layer that's nested within a container layer. Note the behavior will be greyed out if there are no layers on your page. Don't select Current Layer until you've read this tutorial on using multiple layers.

Top Start Position

This is the position to start the scroller - you'd almost always enter 0 here.

Scroll Height

Enter the height of your container layer.

Scroll Direction

Choose the direction to scroll in. Selecting Up or Down will start scrolling in the direction you chose. Choosing Stop will immediately stop scrolling. Choosing Reset will stop scrolling and return the scroller to it's starting position.

Scroll Speed

Choose the speed you'd like your scroller to run at. If you're scrolling text that your user should read (e.g. a news ticker) Slow would be the most suitable setting. Select Medium for something like a picture gallery. I've also included a Fast setting which you can use if you like.

Looping Scroller

Check this box if you'd like your scroller to loop when it reaches the end - this would be useful for something like a news ticker. Checking loop will also enable 2 further options. Continuous - this is the default. When your scroller reaches the end it will return to the start in a continual loop. Auto Reverse - choosing this option will cause your scroller to reverse when it reaches the end. This option isn't useful for text scrollers but can be effective on image scrollers.

Note - the loop options will only be available if you choose Down as your scroll direction.