all groups > macromedia flash sitedesign > february 2006 >
You're in the

macromedia flash sitedesign

group:

A scroll...


A scroll... AmbientSmiley
2/24/2006 2:26:21 PM
macromedia flash sitedesign:
Ok, here's what I need to do. I got me a websight (pardon the new age slang
there), where I have an old fashioned scroll. You know, the medival type scroll
with a big roll at either end? I'm sure you know what I mean :P

Anyway. What I want to do is this. I'm going to put text on that scroll
obviously, but when users move down the scroll for more text, I don't want the
normal scrolling bar on the side, see? I want the users to grip anywhere on the
scroll surface and drag it up or down "manually" you might say. Just grip on
top of the text, in the middle of the scroll surface there and drag it down,
rather than the "in-direct" way of using a scrolling bar on the side there...
Use that hands-on approach, directly.
This sight is for a Nwn2 server I'm whipping up, and the keyword is "old
skool". All of the elements in the game based on old skool techniques and feel,
so I want this websight to give that same feeling.

But... I'm new to flash. Done the "Lynda" tutorial, but nothing even touches
the subject of actually moving something around on the sight with the mouse.
What I imagine I need to do is create an object the user can move about as he
or she pleases, but only on the Y axis. I haven't a clue :P

Help?
Re: A scroll... tralfaz
2/24/2006 3:50:52 PM

[quoted text, click to view]

Whatever the object is, convert it to a movieclip...
1) Select it with a mouseclick or dbl click it to include an outline
2) Press F8 to convert to a symbol, choose movieclip
3) Click once on the new movieclip to select it
4) F9 Open the Actionscript window
5) Enter this code to make the clip draggable

onClipEvent (mouseDown) {
var top = -50; // how far up to allow
var left = this._x; // don't move in x
var right = this._x;// don't move in x
var bot = 408; // how far down to allow
// when the mouse is pressed, if the mouse is over
// the scroll area, start dragging it..
if(hitTest(_root._xmouse, _root._ymouse))
this.startDrag(false,left,top,right,bot);
}


onClipEvent (mouseUp) {
stopDrag(); // if mouse button is released, stop dragging
}

Modify the numbers above for top and bot to have the maximum position
you want the clip to be draggable to.
X position is fixed at whatever the current position is.
HTH
tralfaz


Re: A scroll... AmbientSmiley
2/24/2006 8:17:51 PM
Re: A scroll... michael novia
2/24/2006 8:38:58 PM
track the mouses _x and _y.. on your webSITE.

Re: A scroll... AmbientSmiley
2/24/2006 9:05:57 PM
I got no idea what you mean by that... hehe... :P
Explain?

Re: A scroll... AmbientSmiley
2/25/2006 12:00:00 AM
I just entered your fan club.
Re: A scroll... AmbientSmiley
2/27/2006 5:13:27 PM
There is one more step in the scroll making proccess I'd like to ask about too
tho. See, as I now have a fully working scrolling sufrace there to chuck text
at, there is one more detail I'd like to incorporate. Namely the two rolls at
either end of the scroll there. It doesn't look all too "real" when those two
rolls just sit there on one frame while the user scrolls up and down. I'd like
to throw in an animation on those two rolls to make them roll around as the
user pushes the text up or down. See what I mean?

If not, I'll illustrate a little better. Imagine the jewish tora. Its a scroll
with a pin at either end of the scroll you use to fold the paper around as you
go up or down in the text, right? My scroll has these, and I'd like to have
those two rolls of paper animated to show them being rolled around as the user
goes up and down the text.
-It needs to be interactive so to speak. A user-based animation, where the two
rolls will follow the speed the user is scrolling at. So the animation must be
triggered by the mouse movement it self, and not just a triggered movement on
"OnMouseRelease" or something like that...

As you might guess, I don't have a single clue. This is my first flash
project, so I ask you, guys. Any code functions I should deploy here that you
know of? :P
Re: A scroll... tralfaz
2/27/2006 7:48:34 PM
[quoted text, click to view]

Hmm.. the rolling scroll ends.. I think I would do a bitmap animation
in Photoshop instead of doing it in Flash. Maybe get some photos of
the scroll ends and do something with that.

In flash, if scrolling to maximum down position is 0% and scrolling to
maximum up position is 100%, then if you have an animation that is 100
frames long then you can send it to a place on it's timeline that
corresponds to the percentage of the scroll position. IE.. If your
timeline is 50 frames long..

mc.gotoAndStop(scroll percent / 2);
or 25 frames long..
mc.gotoAndStop(scroll percent / 4);

I can't explain stuff very well. Maybe an example would be easier..
http://members.cox.net/4my5cats/scroll.html
tralfaz

Re: A scroll... tralfaz
2/27/2006 9:42:19 PM
[quoted text, click to view]

If you make the instance names match and change the top and bottom
limit numbers to the length of your scroll you will be able to use
that code.
The length of the scrolls won't matter because it's a calculation of 0
to 100% rather than a fixed size.
If your animated roller is 25 frames then use
gotoAndStop(scrollPercent / 4);
HTH
tralfaz



Re: A scroll... AmbientSmiley
2/28/2006 12:45:41 AM
Allright... I'll rephrase. Straight foreward question...

Re: A scroll... AmbientSmiley
2/28/2006 4:18:03 AM
Thx, man! Exactly what I was after! :)

Yeh, I knew it had to be done as frame-by-frame in adobe (got some work ahead
of me, eh?). Well, I've come this far. This is gonna be one lovable webpage
(gimmick wise).
-Just how to create the function that listened in on the scroll's position.
Damnit... Not a project for little old me, hehe...

But do you suppose I can create just a 25 frame animation that loops? Some
scrolling lengths will be longer than others, and I dunno, but some might
become rather marathon-like... Eh... Why am I asking? Of course it is :P

And thx a bunch! :)

Cheers! :D


Re: A scroll... AmbientSmiley
2/28/2006 5:56:15 PM
Actually, I went ahead with a full 100 frame animation. It'll be smooth enough,
but the longest of the scrolls is almost 2000px long, so it has to have that
many, really, or it'll be rather choppy...

I got six scrolls. Longest at 2000px, and the smallest at 800px. The latter
one there won't be scrollable, as it fits into the screen. So what I was
wondering... Hard to formulate... I can't of course have the animation flip
through all 100 frames on the 2nd shortest scroll, right? It only scrolls for
about 200xp, so the animation for the rolls there should only include a small
portion of the total frames right? It'll use all 100frames when scrolling from
top to bottom on the 2000px scroll, and then only about the first 20 frames for
the smallest one, right?

Do I have to create six different animation clips to fit the length of each of
the scrolls, or is there some trick I can use on the script there to just stop
the animation sooner on the smaller scroll?
(Hope I'm being at least 10% as cohesive as I imagine I am...)
AddThis Social Bookmark Button