Scrollbar

Click and drag the slider to move the text. Or click on the background of the scrollbar to 'pull' the slider.

TUTORIAL INFO
Version Flash 3 Difficulty Intermediate

DOWNLOAD
ZIP	FLA

Gosh! How do they do that?

Okay, it's not exactly revolutionary, but not as easy to do in Flash as you might think. All the Flash scrollbars that I've seen are 'single click' affairs - you can't drag the mouse up and down, you have to repeatedly hit the button to move the text. So I came up with this, which I reckon works more like a standard Windows scrollbar (it's not identical, but it's close).

Here's the .fla file in .zip form.

So how's it done?

It's not actually very hard at all. All the action takes place in the symbol Scroll. Here you'll find a series of frames with the slider moving gradually from top to bottom. As it does so, two invisible buttons (actually, movies that contain buttons -- see below for explanation) ScrollUp and ScrollDown are positioned immediately above and below.

Their function should be pretty obvious: they use Tell Target to a) have the text step back or forward one frame in its scrolling animation (the movie clip Text Anim, label /text) and b) move the movie Scroll (label /scroll) one frame back or forwards in its animation of the slider moving up or down.

The only really weird bit is...

Why are ScrollUp and ScrollDown movie clips and not buttons?

Hmm...tricky to explain. If you look closely at ScrollUp and ScrollDown you'll notice that they each have two frames and two layers. In each frame there are two buttons (two instances of the button Invisble_Button) with the same properties, one of which is directly above the other. In the next frame, the buttons swap positions. Basically if you don't do this, Flash will not recognise the mouse 'dragging over' the button more than once - once it's inside, it will not trigger the Drag Over condition again. To counter this you move the button such that the mouse is alternately inside and outside it - so it's constantly being 'dragged over'. Odd, but it works.

That's it -- simple, huh?

It really isn't very complicated. If you don't understand what's going on, well, I suggest you come back when you understand Flash a bit better (don't run before you can crawl, yeah?).

Stickman