welcome to FlashyExtras

the flash components on this site are simple to use and completely customizable through the supplied xml files. very little or no knowledge of actionscript is required to take advantage of them.

full version - 5.00 GBP

Order with your Credit Card or PayPal account. Once you complete the payment an email will be sent to your address with the product attached.

download free demo

The demo is fully functional but only allows a maximum of 3 scrollers and contains a link to this site.

Features



Customizable : Through the XML file most elements can be changed to suit your needs. Height, speed, direction and colours are just are few of the features that can be altered. New Actionscript feature now allows for custom arrows to be added!

Updateable : Open the XML file in a text editor to add or remove your scrolling elements and the information.

Image Resizing : No need to resize your image, the vScroller does this before displaying the pictures.

Link To Other Pages : The scrollers can be linked to other pages or external sites. The target of the link can be made to load a new window or open in the existing window.

No Flash Software : A swf file is included, all you need to do this add it to your site!

Custom Flash Component : For those with Flash, the vScroller comes as a custom component to add to your library.

Files in the download




vScroller.swf : Already published vScroller allowing you to customize it without Flash software.

vScroller.html : Embedded flash movie ready for instant use.

vScroller.mxp : Flash component allowing you to add the vScroller to your flash files.

vScroller.xml : Simple xml file to customize and add content to the vScroller.

vScroller.fla : For use with Flash Authoring software. Extra features enabled through use of Actionscript.

swfObject.js : Javascript file that is included in .html to display .swf

vScroller

The vScroller is a continuous vertical scrolling image and text component that is fully dynamic and easily updateable with XML! Edit the simple xml document to define the images, titles, captions and the appearance of the vScroller. No need to worry about resizing the images, the vScroller can set the image dimensions before its displayed, all that is required is the image path in the XML.

Basic Scroller Setup

The download includes everything needed to add the vScroller to your html pages. Flash authoring software is not needed unless you intend to add the scroller to your flash movies.

Open vScroller.xml in any html or text editor. This is a simple text file that provides the information that is displayed on the vScroller. It can also be used to customize the way the scroller looks and behaves. The xml structure looks like :

< xml
useXmlAtts="1"
speed="2"
h="350"
w="200"
backgroundColour="FFFFFF"
scrollColour="CCCCCC"
stripeColour="000000"
titleTxtColour="FFFFFF"
infoTxtColour="000000"
arrowBgColour="CC0000"
arrowColour="FFFFFF"
scrollOverColour="009999"
scrollOverAlpha="40"
arrowOverColour="FFFFFF"
arrowOverAlpha="50"
imageLoaderColour="009999"
pauseTime="2"
displayArrows="true" >

The top, opening < xml tag contains a list of attributes that are used to define how the scroller looks and behaves. These attributes are optional if the flash component is used through the component inspector.

Scroller information is represented by the < scroll node. The child nodes - title, info, link, image - contain the data that will be displayed for that scroller.

Once you have finished updating your xml file, save it and test the scroller by opening the vScroller.html.

Customizing vScroller Using XML

Open vScroller.xml using a text editor or html editor. You will notice variables defined at the top. The following is a table of descriptions and sample values for the vScroller attributes.

Attribute Sample value Description
useXmlAtts 1 Value of 0 or 1 indicates whether to use xml or component inspector
speed 2 Speed at which scroller moves. Use negative value to scroll upwards
height 350 Height of vScroller
width 200 Width of vScroller
backgroundColour FFFFFF Background colour
scrollColour CCCCCC Background colour of scrollers
stripeColour 000000 Colour orf horizontal stripes on scrollers
titleTxtColour FFFFFF Colour of scroller title text
infoTxtColour 000000 Colour of scroller information text
arrowBgColour CC0000 Background colour of top and bottom arrows
arrowColour FFFFFF Colour of arrows
scrollOverColour 009999 Colour of roll over clip for scrollers
scrollOverAlpha 40 Opacity for scroll over clip for scrollers
arrowOverColour FFFFFF Colour of roll over clip for arrows
arrowOverAlpha 50 Opacity for scroll over clip for arrows
imageLoaderColour 009999 Colour of image loader
pauseTime 2 Time that scroller pauses (secs)
displayArrows * true Displays arrows at top and bottom

Using vScroller Component

The vScroller component enables you to add the scroller to flash movies. You will need Flash 8 or higher to use the component, and swf files should be published to flash player 8 or higher.

To install the vScroller.mxp you will need the latest version of Adobe Extension Manager. Once installed, double click the vScroller.mxp to add the scroller to your component library.

The vScroller component will be available in the jbuda_components sub-directory. Drag a copy onto the stage, then open the component inspector to adjust the scroller attributes.

NOTE - to use the component inspector parameters, the useXmlAtts in the xml file must be set to 0. Using the xml to set the vScroller parameters is a good way to update it without republishing each time.

The component inspector for the vScroller will be similar to the one pictured below. For a full list of the parameters and their descriptions, please see the xml table above.

Adding Information With XML

Under the closing tag of the top xml > the next set of nodes < scroll provide the information for the scrollers.

Attribute Description
scroller Use attribute hold='Y' to make scroller pause
title Title of the scrolling clip
info Main information
link Link url for the scroller. Also the attribute 'window' indicates where it opens. Use _blank or _self
image Link to the image. Also attributes w='100' and h='100' allow for image to be resized, defaults : w=70. h=84