Tracking Forums, Newsgroups, Maling Lists
Home Scripts Tutorials Tracker Forums
  Advanced Search
  HOME    TRACKER    Flash




How Do I Make A Custom Scrollbar Using Buttons?



forgive the newbieness, but i've not been able to come up with an answer through searching. i'm using flash mx 2004 w/ 7.2 update.

i've got two situations in which i'd like to make a custom scrollbar:

1) using a regular text frield
2) in a textarea component that loaded external css formatted text

i just want to have two buttons, one of a triangle pointing up, another down, that can be used to scroll the text accordingly.

maybe the solution is the same for both situations, but does anyone have some direction for me here? an example file which uses buttons as scrollers i could look at?



ActionScript.org Forums > ActionScript Forums Group > ActionScript 2.0
Posted on: 05-15-2005, 08:53 AM


View Complete Forum Thread with Replies

See Related Forum Messages: Follow the Links Below to View Complete Thread

How To Make Custom Scrollbar ?
hey guys, plz help me in this matter..

how to create a custom scrollbarr ??

can anyone explain me in detail plz since im a flash dumb..

thanks for everything..

Custom Scrollbar Buttons
I guess I must have missed it when I was learning about Flash MX, bu I need to know how to make custom scrollbars that can scroll text.

Any help would be appreciated,
Brendan

Buttons In Simple Custom Scrollbar
Hi.
I've gove trougth the simple custom scrollbar http://www.kirupa.com/developer/flash8/scrollbar.htm step by step. Ive got it working just fine.
Now I need to but a button in the scrollbar content, that easy, in MC content I inserted the button I need and the code.

on (release) {
trace("historia");
gotoAndStop("historia");
}

unfortunatly the button doesnt work, stangly not eaven trace code gets called.

Ive checked and the frame name instance "historia" is correct. Any sugestions?

Combo Box Component Tutorial Or How Do I Make A Scrollbar For Buttons.
OK I want to make a combo box OR I want to use a scrollbar for buttons that I made but how do I do that? Oh and the scrollpane component tutorial teh pics are gone!.

Custom Cursor + Custom Scrollbar = Problem
Ok, this is the thing: I made a scrollbar in flash, just like I made a cursor. the cursor only works when I set the settings to flash < 6 and as soon as I use the scrollbar while also using the cursor, it stops working. i suck at AS-ing and any help would be greatly appreciated.

~YF220

PS: .fla included.

Custom Scrollbar
Once again, i did check the forums. Is there a way to actually draw my own scroll bar and then turn it into one?

Custom Scrollbar
hoi @ll!

i'd like to make a scrollbar (2 buttons: scroll UP and DOWN)
i made a movieclip wich is the button (fadein-tween effect). so if
textfield.maxscroll = 1 the button movie shouldn start playin, else (if the text is scrollable) the movie should start play so that he's visible. who can i make the buttons scroll the text and how can i stop, start the button play. pls help

Custom Scrollbar
i am going nuts trying to wrap my head around creating a scrollbar. i understand the mask, i understand how to load my html text externally-i have the scrollbar created, the drag works wonderfully, html looks great....essentially all the easy stuff is done!!....what i am not getting, is the acutal building of this scrollbar!! i have seen numerous tutorials on this, but the math is the stinger....perhaps because i get lost in the variables....does anyone have a bridseye on this to help make the learning curve a little less steep???

Custom Scrollbar Help..
edit....

thread got "sidetracked"

please close or delete... started new one to deal with CODE HELP only..

thanks

Custom ScrollBar Help
ok..Ive been trying to make an EXTREMELY easy to understand custom scrollBar "component"

I think I have it 90% complete....however....I seem to be having a problem on how the "calculate" the height of the "content"..and make the scroller scroll through ALL content no matter what length..

I do NOT want the "scroll bar" to re-size or shrink with the amount of content, if posiible...just the same static "image/graphic" for the scroll bar..

I basically just constrain the draggability but the startDrag(); command...alowing for the drag on -Y for only as long as the "viewable border" is long.

However..to either scrolls the content to far..or not enough....

can anyone help me?

very simple .fla to look at...

breakdown:

on _root..

you have a.) "contentContainer_mc" .... inside this is a movie clip called "scrolledContent_mc"..inside this is the content to be scrolled...a couple text fields..some inges..etc.

also on _root..
b.) "scrollBar_mc"...inside that is another movieclip called "scrollButton_mc" (which is the actual grpahics/button of the what the scrollBar looks like)


attached to the "scrollBar_mc" is the code :

Code:
onClipEvent (load) {
oldY = 0;
newY = 0;
currentY = 0;
}
onClipEvent (enterFrame) {
currentY = _root.scrollBar_mc.scrollButton_mc._y;
newY = oldY + (currentY - oldY)/8;
_root.contentContainer_mc.scrolledContent_mc._y = newY;
oldY = newY;
}


I have paths "hard coded" for testing... (ie: _root.etc..etc..)

and this code on frame 1 of the "scrollButton_mc"

Code:
this.onPress = function() {
startDrag(false, 0, -1000, 0, 0);
}
this.onRelease = function() {
stopDrag();
}


but if you change the contents "height"..the scrollbar gets all whacked out..lol

how can I get it )the scrollBar) to scroll the length of the "outline/border" or the text field...but still scroll all the contents in their entirety??

heres the .fla if anyone can help.

thanks..

p.s. Id like to stick with the code that is presently there...as I already understand it...and modifying should be easier then trying to re-write it.

thanks (again)

p.p.s

please only reply in here with "CODE" or solution related posts.. its gotta be simple...I just cant figure it out...(had a topic get off focus) LOL

(goal here is to make the simplest scrollBar I possibly can)

Custom Scrollbar
how do you design a custom scrollbar with a smooth middle dragger (i don't know what else to call it)?
Thank you

Custom Scrollbar
I was wondering how to customize the right scroll bar. You see on AS.org, it is the standard according to the browser. But, if you look at this site, and other sites, you will see that it is customized: http://www.oringe.com/flashSite/

afterthought: after you enter, click any link and you'll see the custom scroller.

I've seen this on other sites as well.

thanks

Custom Scrollbar
Hello Any idea how can we move scrollbar according to movieclip X or Y Position from following code.


ActionScript Code:
mainTargetY = mainInitY-(main._height-Stage.height)*scrollbar.scrollbutton._y-scrollbarInitY)/scrollAreaHeight;
main._y += Math.ceil((mainTargetY-main._y)/2);

Custom Scrollbar
I have created a custom scrollbar in Flash, and I want it NOT to appear when the text field does not require a scroll. What actionscript do I need, and where do I apply it?

Custom Scrollbar
Hey guys,

What I'm looking to do is create a very simple scrollbar, I don't want any up/down arrows or scrollbar bg or anything, just a circle, that will act as a scrollbar, so when you drag it down the text will scroll (just like any other scrollbar except it won't have arrows, and I don't want the circle to resize it's height depending on the amount of text in the box).

Hope I didn't confuse you .

-Nick

Custom Scrollbar
I'm wondering if there is a way to make a custom scrollbar that scrolls along a motion path-specifically a curved one.
I've played with some scripts for making custom scrollbars, but whenever I specify the x and y boundaries for the scroll, it doesn't attach to the curved path and doesn't scroll the text in the text box.
Thanks for your help,
justin

Custom Scrollbar
I currently have a sidebar and text that I want to scroll down in the text box, rather than extending the site vertically. However the scrollbar is ugly.

I know that CSS can be applied to flash to format text, so would it be possible to manipulate the look of the scrollbar? Or should I create my own arrows to move text up and down?

I just figured that if the CSS will work, it would be quicker, as I havent tried making my own.

PXC

Custom Scrollbar?
how would i make a custom scrollbar for a textarea component? is it even possible? here is my website http://llamaswillattack.linuxinit.net if you go to the flash version of the site...go to either news or journal section and you'll see the scrollbars...and they really don't look too good...so i wanna know if i can customize it in any way...

also...i'm open to any opinions on some more animation i should add to the flash version of the site so that it doesn't look so plain...

Custom Scrollbar AS
Normally I would use the scrollbar component and skin it to suit my needs but today I needed to make a custom scrollbar because I didn't want the slider part to expand or contract.

So... I went ahead and did it and it works just fine It didn't even take me very long to do so I must be improving a bit.

But it's times like these, where I'm proud of myself for making a breakthrough that I need to humble myself and try to expand my understanding of AS even further.

So I ask myself, "What would one of the real AS hotshots at Kirupa.com do?" And things like AS 2.0 and prototypes and other things I don't understand at all start flashing through my head.

To start here's what I wrote to operate my scrollbar:


ActionScript Code:
slidePerc = 0;newsScroll.upArrow.onPress = function() {    newsScroll.upArrow.gotoAndStop(2);    arrowScroll("up");};newsScroll.upArrow.onRelease = newsScroll.upArrow.onReleaseOutside = function() {    newsScroll.upArrow.gotoAndStop(1);    arrowScroll("none");};newsScroll.downArrow.onPress = function() {    newsScroll.downArrow.gotoAndStop(2);    arrowScroll("down");};newsScroll.downArrow.onRelease = newsScroll.downArrow.onReleaseOutside = function() {    newsScroll.downArrow.gotoAndStop(1);    arrowScroll("none");};function arrowScroll(dir) {    this.onEnterFrame = function() {        slidePerc = ((newsBox.scroll-1)/(newsBox.maxscroll-1));        newsScroll.scrollArea.scroller._y = (newsScroll.scrollArea._height-newsScroll.scrollArea.scroller._height)*slidePerc;        if (dir == "up") {            newsBox.scroll--;        } else if (dir == "down") {            newsBox.scroll++;        } else if (dir == "none") {            delete onEnterFrame;        }    };}newsScroll.scrollArea.scroller.onPress = function() {    newsScroll.scrollArea.scroller.startDrag(false, 0, 0, 0, newsScroll.scrollArea._height-newsScroll.scrollArea.scroller._height);    arrowDrag(true);};newsScroll.scrollArea.scroller.onRelease = newsScroll.scrollArea.scroller.onReleaseOutside=function () {    newsScroll.scrollArea.scroller.stopDrag();    arrowDrag(false);};function arrowDrag (cond){    this.onEnterFrame = function(){        if(cond){            slidePerc = newsScroll.scrollArea.scroller._y/(newsScroll.scrollArea._height-newsScroll.scrollArea.scroller._height);            newsBox.scroll = (newsBox.maxscroll*slidePerc)+1;        }else{            delete onEnterFrame;        }    }}



Now what would you do to make it smaller/better/smarter/whatever?

Custom Scrollbar
in flash8/mx04 is it possible to create a custom scrollbar for text only?
i would like to make a dynamic text field with a scrollbar that doesnt need to be contained in a masked mc like most of the scrollers i have seen on this forum so far. i dont want to use the UIscrollBar component because it doesnt quite (well, doesnt at all) fit in with the theme of the project i am working on.

so, anyone have any suggestion on how to make a scrollbar?

Custom Scrollbar
im sure that this is one of those really simple questions, easy to answer, but i just cannot figure it out!

i did a search for 'custom scrollbar' before posting this, just to be sure... and i didnt find anything

my question is, how can one make a custom scrollbar... i need a dark dark grey thin one... plz help

thanks

Custom Scrollbar
Can somebody please tell me how to create a custom scrollbar in flash (not with the component). I want a round scrollbar instead of a rectangle. See drawning (something like that)
Thanx...

Custom Scrollbar
I read you tutorial on custom scrollbar. I want to know if instead of making the scrollbar, can I use the component interface UCScrollBar? If not, do you have a tutorial showing you how to use the UCScrollbar.

Thank you!

Custom Scrollbar
Hello,

I have been trying to skin the scrollbar component but every time I do it stops working.

I am using Flash Flash CS3 (Actionscript 2.0).

Can anyone help out?

I would like a very simple scrollbar - just a line and a circle.

I want to stick with the component scrollbar for ease as I am still learning Flash but would like to schange the style. Perhaps there is even a place where I could download skinned component scrollbars to use?

Anyway, thanks in advance for any help,

David

Custom Scrollbar
Hey guys,

What I'm looking to do is create a very simple scrollbar, I don't want any up/down arrows or scrollbar bg or anything, just a circle, that will act as a scrollbar, so when you drag it down the text will scroll (just like any other scrollbar except it won't have arrows, and I don't want the circle to resize it's height depending on the amount of text in the box).

Hope I didn't confuse you .

-Nick

Custom Scrollbar
I'm wondering if there is a way to make a custom scrollbar that scrolls along a motion path-specifically a curved one.
I've played with some scripts for making custom scrollbars, but whenever I specify the x and y boundaries for the scroll, it doesn't attach to the curved path and doesn't scroll the text in the text box.
Thanks for your help,
justin

Custom Scrollbar
I currently have a sidebar and text that I want to scroll down in the text box, rather than extending the site vertically. However the scrollbar is ugly.

I know that CSS can be applied to flash to format text, so would it be possible to manipulate the look of the scrollbar? Or should I create my own arrows to move text up and down?

I just figured that if the CSS will work, it would be quicker, as I havent tried making my own.

PXC

Custom Scrollbar
Does anyone know how to make a custom scrollbar who'd be willing to teach me?


Thanks,

Chupa

AS:Custom Scrollbar
I created a slick scrollbar to mimic my clients site in MX04... However i'm unable to AS it correctly. I have the following gfxs... A "Channel" (the thumb slider moves on), "Slider", "Up", and "Down". Part of my problem is the "Slider" is moving to far vertical on my custom scrollbar and the following code isnt working when I attach to my movie clip buttons ("Up", "Down", "Slider")... I'm sure this is a no-brainer to you AS gurus. Can someone PLEASE help?


on(press){
tbox.scroll++; // and tbox.scroll--; to your up button
}

and attached to your channel movieclip which contains the child movieclip slider with top left at 0,0:

channel.slider.onPress = function() {
this.startDrag(0, this._y, 0, this._y, _root.channel._height-this._height);
scrollI = setInterval(scrollF, 100);
};
channel.slider.onRelease = channel.slider.onReleaseOutside=function () {
this.stopDrag();
clearInterval(scrollI);
};
function scrollF() {
tbox.scroll = Math.round((tbox.maxscroll-1)*channel.slider._y/(channel._height-channel.slider._height)+1);
}

Help With Custom Scrollbar
hello everyone. I've made scrollbars before, but I've never done one where the scroller resizes itself to the ratio of the content to the area's height. I've almost got it figured out, but it's giving me alot of bugs.

Here is the code, in Frame 1:


ActionScript Code:
Stage.scaleMode = "noScale";
Stage.align = "TL";
function setScrollerHeight() {
    h = scrollbar.bg._height;
    contentheight = movloader._height;
    perc1 = (h/contentheight);
    perc2 = (h*perc1);
    if ((scrollbar.scroller._y+perc2)>h) {
        scrollbar.scroller._y = h-scrollbar.scroller._height;
        scrollContent();
    }
    scrollbar.scroller._height = (perc2);
}
function scrollContent() {
    contentHeight = movloader._height;
    areaHeight = scrollbar.bg._height;
    scrollend = areaHeight-scrollbar.scroller._height;
    cstart = 0;
    cend = -(contentHeight-areaHeight);
    perc1 = Math.round((scrollbar.scroller._y/scrollend)*100);
    perc2 = (cend/100);
    movloader._y = perc2*perc1;
}
function resizeeverything() {
    w = Stage.width;
    h = Stage.height;
    if (h<=600) {
        scrollbar.bg._height = h;
        scrollbar._visible = true;
        setScrollerHeight();
        scrollContent();
    } else {
        scrollbar._visible = false;
    }
    scrollbar._x = (w-scrollbar.bg._width);
        setScrollerHeight();
        scrollContent()
}
resizeeverything();
var l:Object = new Object();
l.onResize = function() {
    resizeeverything();
};
Stage.addListener(l);


I uploaded the project Here so you can see exactly what I'm talking about.

Any help is greatly appreciated!!

Custom Scrollbar
I have a problem creating a scrollbar and need help!

I used the following tutorial for it http://www.kirupa.com/developer/flash8/scrollbar.htm but i think there is a problem with the code.

Problem:
The scrollbar works fine with short texts but whenever I add a long one inside the content layer any text that goes pass H= 1640 (in the properties panel) appears invisible when I test the movie.

Download:
The FLA file is available for download at: http://www.kirupa.com/developer/flash8/scrollbar9.htm

I've send the file to a couple of people but noboddy can figure out why it is doing that.
If any of you can tell why and how to fit it, I?d great appreciated because it?s driving me crazy.

Thanks.
arg :?

[F8] Horizontal Scrollbar Works, But Buttons On The Scrollbar Don't?
I've done a scrollbar like this one:
http://www.kirupa.com/developer/mx/infinite.htm
It works fine.

However, I want the individual buttons (button1, button2, etc.) on the scrollbar to load an image from my library whenever they are pressed. I've loaded an MC (content_mc) above the scrollbar for which the images will be seen, and added the images to each individual frame. I used the actionscript from my last menu which works great, but this one with the scrolling MC menu does not work.


Code:
content_mc.stop();
speed = 3
target = button1._y;
for (var i = 1; i<4; i++) {
this["button"+i].pageNum = i;
this["button"+i].onPress = function() {
target = this._y;
content_mc.gotoAndStop(this.pageNum);
};
}
this.onEnterFrame = function() {
current._y += (tagert-current._y)/speed;
};

Custom Scrollbar Trouble
ok everybody...here's my problem:
I'm working in flash mx (the version preceding the latest and greatest, i gather). When I first made this site, I either wasn't confident in using components, or i wasn't satisfied with the options the scroling components allowed me, so i decided to script my own scrollbars. They're really simple and they work, except for the fact that you have to repetitively click the up and down arrows to get them to move the scroll pane more than 1 line. In other words, you cannot hold down the mouse over the up and down arrows to create a continuous scroll. I want to be able to do this, I just don't know how to script it. The site is up and running, as it is functional for the most part, I'd just like to work out this kink (and a few others i may be asking you all about later).

so here's the URL:
http://www.tessaperry.com
(the offending scroll bars can be found in the "journal" section, which is accessed through the quotation mark icon at the bottom of the interface--amongst other sections)

and this is the offending script from the down arrow in the journal section:
on (press) {
journalText.scroll += 1;
}

I'm guessing all my problems have something to do with that "1", but I dunno what to replace it with. Thanks for any help which you can be.

Custom Scrollbar Problems
So I've built this custom scrollbar for a dynamic text box and everything works fine except for one thing and I know there's gotta be an easy answer that I'm just not seeing since I've been staring at it for so long. If you click on the UP/DOWN buttons, the text scrolls, but the scrollbar doesn't scroll at the same pace. If you drag the scrollbar the text moves at the right pace, but the second you go back to the buttons, the bar moves up and down at a slightly different pace. Here's my code:


Code:
scrolling = function () {
var scrollht:Number = scrolltrack._height;
var boxht:Number = scrollbox._height;
var scrollarea:Number = scrollht-boxht;
var ms:Number = newsBox.maxscroll;
var scale:Number = (ms-1)/scrollarea;
var ypos:Number = scrolltrack._y;
var textpos:Number = newsBox.scroll;
var left:Number = scrolltrack._x;
var top:Number = scrolltrack._y;
var right:Number = scrolltrack._x;
var bottom:Number = (scrolltrack._y+(scrollht-boxht));
var ymove:Number = 0;
var textmove:Number = 0;

var percent = Math.round((ms/scrollht)*100);
var botPercent = Math.round((ms/bottom)*100);
var topPercent = Math.round((ms/top)*100);
scrollbox._y = ypos;

scrollbox.onPress = function() {
startDrag(this, false, left, top, right, bottom);
this.onMouseMove = function() {
ymove = (ypos-this._y);
textmove = (Math.round(ymove*scale));
newsBox.scroll = textpos - textmove;
};
scrollbox.onMouseUp = function() {
stopDrag();
delete this.onMouseMove;
ypos = this._y;
textpos = newsBox.scroll;
};
};

scrollingUp = function() {
newsBox.scroll--
if (scrollbox._y > top){
scrollbox._y = Math.round(scrollbox._y-(bottom*(percent/100)));
} else {
scrollbox._y = top;
}
};
scrollingDown = function() {
newsBox.scroll++
if (scrollbox._y < bottom){
scrollbox._y = Math.round(scrollbox._y+(bottom*(percent/100)));
} else {
scrollbox._y = bottom;
}
};
scrollUp.onRollOver = function() {
this.onEnterFrame = function () {
scrollingUp();
trace (scrollbox._y)
}
};
scrollDown.onRollOver = function() {
this.onEnterFrame = function () {
scrollingDown();
trace (scrollbox._y)
}
};
scrollUp.onRollOut = function() {
delete this.onEnterFrame
};
scrollDown.onRollOut = function() {
delete this.onEnterFrame
};


if (ms==1) {
scrollbox._visible = false;
scrolltrack._visible = false;
scrollbg._visible = false;
}
else {
scrollbox._visible = true;
scrolltrack._visible = true;
scrollbg._visible = true;
}
};
Any ideas on what I'm doing wrong?

Custom Scrollbar Is Glitchy
As I've already worked through one solution to this problem, only to end up with different problem that I can't figure out, I decided to post here and start back at the beginning to see if any of you have a better solution.

The site I'm referencing is here: http://www.spectrum-graphics.com

The problem is with the horizontal scrollbars. Which can be found in sections of the site like portfolio. The first time you drag the handle the scrollbar jumps back to the beginning of the bar, then after that its ok although I think I would prefer if there wasn't such elastic easing on the scroller itself.

I'm working with code that I didn't write as this was contracted out by the company I work for and then that guy contracted out to someone else and we have no way of contacting that person now.

Here's the code:

in frame 1:

Code:
stop();
fscommand("allowscale", "false");
fscommand("showmenu", "false");
On a MC called "Slider A" (which is the handle on the scroller):


Code:
onClipEvent (load) {
diff_x = _parent.bound_box._width - this._width;
bounds = _parent.bound_box.getBounds(_parent);
left = bounds.xMin+(this._width/2);
right = bounds.xMax-(this._width/2);
}

onClipEvent (enterFrame) {
_parent.content._x = -(((this._x-left)/diff_x)*(_parent.content._width-_parent.bound_box._width));
}

onClipEvent (load) {
friction = ".07";
speed = 1;
size = getProperty(this, _width)/2;
}

onClipEvent (mouseDown) {
o_time = getTimer()/1000;
}

onClipEvent (mouseUp) {
n_time = getTimer()/1000;
}

onClipEvent (enterFrame) {
time = o_time-n_time;
speed = speed*1.1;
o_x_pos = x_pos;
x_pos = this._x;
if (drag == "true") {
x_velocity = (x_pos-o_x_pos)*time;
} else {
x_pos = x_pos+(x_velocity/speed);
if (x_pos-size<=bounds.xMin) {
x_pos = bounds.xMin+size;
x_velocity = -x_velocity*friction;
} else if (x_pos+size>=bounds.xMax) {
x_pos = bounds.xMax-size;
x_velocity = -x_velocity*friction;
}
setProperty(this, _x, x_pos);
}
}
On a btn which is inside of the MC "SliderA":

Code:
on (press) {
startDrag("", false, left, getProperty("", _y), right, getProperty("", _y));
drag = "true";
speed = 1;
}
on (release, releaseOutside,dragOut) {
stopDrag();
drag = "false";
}

does anyone know what I could do to make this smoother and not have that glitch at the beginning? I'm at a loss after spending hours trying to rewrite this code only to find myself back at square one.

Custom Scrollbar With Easing
can someone point me in the direction of a good tute or info on creating a scroller mc with easing? The scrollbar type NOT the up and down buttons that require a mouseclick.

I want to be able to scroll mc's based on the vertical or horiz. position of a custom scrollbar made in photoshop.

not interested in skinning pre-built flash components quite yet...

I'm interested in figuring out how to set up the scrolling function based on the height of my content and all that good stuff...

i've been trying to dissect several posted .fla's but can't quite figure out how to get the code working with my specific graphics/objects...

any pointing in the right direction is appreciated!

Custom Scrollbar...not Revealing Everything?
Just wondering if anybody else has had this problem before. I have a custom scrollbar (not easing, just a regular one), but if the height of the content it's scrolling gets to be over a certain size, then it won't scroll all the way to the bottom, so some stuff gets cut off.

Can anybody see anything wrong with the following code??


ActionScript Code:
//Function to make everything the right size based on what it's scrolling
function Trigger() {
    Bar._height = this._parent.ReplyContent.Mask._height;
    NubSize = this._parent.ReplyContent.Mask._height/this._parent.ReplyContent.ReplyList._height;
    Nub._height = NubSize*Bar._height;
    Distance = 100/(Bar._height-Nub._height);
    if (this._parent.ReplyContent.ReplyList._height<this._parent.ReplyContent.Mask._height) {
        this._parent.ScrollBarReply._visible = false;
        ScrollWheel = false;
    } else {
        this._parent.ScrollBarReply._visible = true;
        ScrollWheel = true;
    }
}
//Handle the mouse wheel
MListen = new Object();
MListen.onMouseWheel = function(delta) {
    if (ScrollWheel) {
        if (delta>0) {
            if (Nub._y-delta>Bar._y) {
                Nub._y -= delta;
            } else {
                Nub._y = Bar._y;
            }
        } else {
            if (Nub._y-delta<(Bar._y+Bar._height)-Nub._height) {
                Nub._y -= delta;
            } else {
                Nub._y = (Bar._y+Bar._height)-Nub._height;
            }
        }
        Scroll();
    }
};
Mouse.addListener(MListen);
//Handle the scrolling of the Nub when clicked by the mouse
Nub.onPress = function() {
    Nub.startDrag(false, Bar._x, Bar._y, Bar._x, (Bar._y+Bar._height)-Nub._height);
    Scroll();
};
Nub.onRelease = Nub.onReleaseOutside=function () {
    Nub.stopDrag();
    delete onEnterFrame;
};
//Function to Scroll the content
function Scroll() {
    onEnterFrame = function () {
        Distance = 100/(Bar._height-Nub._height);
        Proportion = this._parent.ReplyContent.ReplyList._height/this._parent.ReplyContent.Mask._height;
        Location = Math.ceil((Nub._y-Bar._y)*Distance);
        this._parent.ReplyContent.ReplyList._y = -(Location*Proportion);
    };
}

I know I could just add a "+100" somewhere so the Nub scrolls 100 pixels more than it's supposed to, but that would cause it to have some big gaps of "whitespace" when the content is not too big, so I'm kinda hoping that would be a lst resort.

Thanks,

Eric

Problem With A Custom Scrollbar
I have used this tutorial kirupa tutorial to create custom scrollbars in a flash site I am working on. In all instances I have used these scrollbars, they work perfectly except for one. The faq... it's about 2400 pixels tall, and is scrolling under a mask that is 450 pixels tall. Seems that the complete lenght of the faq does scroll, but you cannot view approximately the bottom third of the faq. it comes up blank.

Can this be fixed?

Here is the action scripting for the scrollbar (same as in the tutorial...

--------------------------


scrolling = function () {

var scrollHeight:Number = scrollTrack._height;
var contentHeight:Number = contentMain._height;
var scrollFaceHeight:Number = scrollFace._height;
var maskHeight:Number = maskedView._height;
var initPosition:Number = scrollFace._y=scrollTrack._y;
var initContentPos:Number = contentMain._y;
var finalContentPos:Number = maskHeight-contentHeight+initContentPos;
var left:Number = scrollTrack._x;
var top:Number = scrollTrack._y;
var right:Number = scrollTrack._x;
var bottom:Number = scrollTrack._height-scrollFaceHeight+scrollTrack._y;
var dy:Number = 0;
var speed:Number = 10;
var moveVal:Number = (contentHeight-maskHeight)/(scrollHeight-scrollFaceHeight);

scrollFace.onPress = function() {

var currPos:Number = this._y;
startDrag(this, false, left, top, right, bottom);
this.onMouseMove = function() {

dy = Math.abs(initPosition-this._y);
contentMain._y = Math.round(dy*-1*moveVal+initContentPos);

};

};
scrollFace.onMouseUp = function() {

stopDrag();
delete this.onMouseMove;

};
btnUp.onPress = function() {

this.onEnterFrame = function() {

if (contentMain._y+speed<maskedView._y) {

if (scrollFace._y<=top) {

scrollFace._y = top;

} else {

scrollFace._y -= speed/moveVal;

}
contentMain._y += speed;

} else {

scrollFace._y = top;
contentMain._y = maskedView._y;
delete this.onEnterFrame;

}

};

};
btnUp.onDragOut = function() {

delete this.onEnterFrame;

};
btnUp.onRollOut = function() {

delete this.onEnterFrame;

};
btnDown.onPress = function() {

this.onEnterFrame = function() {

if (contentMain._y-speed>finalContentPos) {

if (scrollFace._y>=bottom) {

scrollFace._y = bottom;

} else {

scrollFace._y += speed/moveVal;

}
contentMain._y -= speed;

} else {

scrollFace._y = bottom;
contentMain._y = finalContentPos;
delete this.onEnterFrame;

}

};

};
btnDown.onRelease = function() {

delete this.onEnterFrame;

};
btnDown.onDragOut = function() {

delete this.onEnterFrame;

};

if (contentHeight<maskHeight) {

scrollFace._visible = false;
btnUp.enabled = false;
btnDown.enabled = false;

} else {

scrollFace._visible = true;
btnUp.enabled = true;
btnDown.enabled = true;

}

};
scrolling();

--------------------------

A link to the actual flash file is SWF file and to see the scrollbar problem in action view the flash file and hit the FAQ link, the faq content displays the problem.

Here is a screenshot of the flash file worked in Flash 8 Pro
Screenshot

Easy Custom Scrollbar?
Hi,
I have a dynamic text box that is getting its content from a .txt file. I have a simple scrollbar that has a slider insde of a box that denotes the length of the path. What is the simplest way to program this scrollbar?

Thanks!

Custom Scrollbar Creation?
Hi,

Could anyone help or point me in the right direction on how to create a custom scrollbar like the one on this site:

http://www.studiogusto.net/ Then go to there Portfolio page.

Thanks

Custom Made Scrollbar
I know there are lots of posts but I want to make a simple custom scrollbar for a text field.

I know I can make a couple of buttons with the following code:


Code:

Upward Button
on(press)
{
upint=setInterval(scrup,100);
}

on(release)
{
clearInterval(upint);
}

Downward Button
on(press)
{
downint=setInterval(scrdown,100);
}

on(release)
{
clearInterval(downint);
}
But how do I make a dragger?

Simple Custom Scrollbar With XML
Thank! Simple Custom Scrollbar - VERY GOOD tutorial!

But, i have problem with XML wiew in Movie Clip : contentMain

function display() {
this.createTextField("textFromXML"+i, i+10, 0, 0, 306, 20);
with(this["textFromXML"+i]){
multiline = true;
textColor = "0x000000";
autoSize = true;
wordWrap = true;
text = xmlText[0];
};
display();
}

I canīt see text.
Why i canīt see XML text in Movie Clip : contentMain?

Custom Scrollbar Tutorial
hi everyone
i'm new, and i recently completed the first part of the custom scroll bar tutorial and the file i created had a scroll bar which was out of alignment (it scrolled but started from the middle while the content started at the top). i spent a while comparing the finished source file and the one i had created. and i realised that the "registration" of the components was different. (i think it is called registration).

anyway, to cut a long story short, i automatically had the symbols with the "little cross thingy" in the centre, not the top right.

i originally began the thread to ask for help but then later realised that it was quite easy to fix, just move the graphics around within the symbols.

anyway, i'm not sure who writes the tutorials but i just think that they could also remind the viewer to make registration correct.

Simple Custom Scrollbar
I am so happy that ive found this site to know everything about flash/xml/php. It really helps me a lot. I was so happy ive finally found a very simple MovieClip Scrollbar. Anyway, what I want to add to this script is how to add an external image to the content which is under the movieclip "contentMain".

I was thinking to add this script that I also learn from this site but I dont know how to pass the variable to the content of the scrollbar.


I hope someone could help me. It will be a great help. Thanks.

MovieClip.prototype.fadeIn = function() {
this.onEnterFrame = function() {
if (this._alpha<100) {
this._alpha += 10;
} else {
delete this.onEnterFrame;
}
};
};
bar._visible = false;
border._visible = false;
var empty = this.createEmptyMovieClip("container", "100");
empty._x = 0;
empty._y = 0;
contentMain = new MovieClipLoader();
preload = new Object();
contentMain.addListener(preload);
preload.onLoadStart = function(targetMC) {
trace("started loading "+targetMC);
container._alpha = 0;
bar._visible = true;
border._visible = true;
pText._visible = true;
};
preload.onLoadProgress = function(targetMC, lBytes, tBytes) {
bar._width = (lBytes/tBytes)*100;
pText.text = "% "+Math.round((lBytes/tBytes)*100);
};
preload.onLoadComplete = function(targetMC) {
container.fadeIn();
border._visible = false;
bar._visible = false;
dText._visible = false;
trace(targetMC+" finished");
};
//default image
contentMain.loadClip("graco_products.jpg", "container");

[F8] Custom Scrollbar With Contentstarting ABOVE Above Y=0
Hi,

My problem is with scrolling vertical content with a custom scrollbar, where the dynamic content often starts at a y value ABOVE the viewer (or mask). I can get the scrollbar to reflect the correct % of available content on the scrolltrack, but for the life of me am stuck allowing scrolling for the full height of the content.

The attached FLA (v8) shows where I'm stuck and how far I got. It's a much simplified version of the final movie, with static content for now, but demonstrates a case in point.

I can't use the built-in scrollbar component/s because the content MC will be dynamically populated with further MCs and the content._y value will change constantly, usually ABOVE the 0 y coord of the movie.

I'm going mad with this, and it's probably easily sorted, but my poor brain has melted. I have looked high and low, but haven't found the solution, or cleared my brain enough to work it out. I'm waiting for that 'doh' moment. Any help much appreciated!

Simple Custom Scrollbar Help
Hi, I have used the simple custom scrollbar on previous websites and it works great, but now I am needing to make the scrollber horizontal instead of verticle. I switched all of the x axis and y axis and all of the heights and widths. The scrollbar scroll left to right fine but I have 2 problems:

1. The content within the movie clip does not move when you try and scroll

2. When you grab the slider instead of using the scroll left and right buttons the slider moves vertically instead of horizontally.

Attached is my FLA file, I am using MX 2004.

If anyone could give me a had I would really appreciate. Thank you for all of the help.

- Brian

Simple Custom Scrollbar
I am having some trouble following the tutorial made by kirupa called "Simple Custom Scrollbar" http://www.kirupa.com/developer/flash8/scrollbar.htm

I follow all the directions to page 3 keeping in mind the camel case as well as the actions layer.

At the end of page 3, when kirupa tells me to test the movie (control+enter) I enter the html screen. This is when my problem arises.

> The scroll bar starts out in the middle of the scrollTrack
> The scrollFace goes below the btnDown and stops halfway down.

I uploaded the published file to my website. http://www.omnishadow.com/whatsupwiththis.html Please take a look at it.
If you have any suggestions on why this is happening, please let me know.

Thanks

Custom Scrollbar HELL
Hi all!

I am trying to make my own text scrollbar with dragger. I dont want up or down buttons just the dragger. I ve done this so far...


Code:
var scrollHeight:Number = scrollTrack._height;
var ms:Number = newsText.maxscroll;
var left = scrollTrack._x;
var right = scrollTrack._x;
var top = scrollTrack._y;
var bottom = scrollTrack._height-scrollBut._height+top;
var down:Boolean = true;
scrollBut.onPress = function() {
startDrag(this, true, left, top, right, bottom);
this.onMouseMove = function() {
if (newsText.scroll>0) {
if (down == true) {
newsText.scroll++;
}
}
if (newsText.scroll == ms) {
down = false;
trace(down);
if (down == false) {
newsText.scroll--;
}
}
};
};
scrollBut.onMouseUp = function() {
stopDrag();
delete this.onMouseMove;
};
It scrolls till the end of text but not to the beginning....

Thanks in advance!

Help With Simple Custom Scrollbar
Ive added this scrollbar to a project Im currently working on & it works perfectly. The client has however, asked for the scrollbar areas to refresh which Im having trouble with.

http://www.kirupa.com/developer/flash8/scrollbar.htm

Currently, when a user uses the scrollbar on a particular section, then navigates to another section, then back to the section with the scrollbar the scrollable area is at the same position as it was after the initial interaction...

Basically what i need to achieve is for the scrollbar to refresh so it goes back to its default state when it loads the mc (from the library)..

Any thoughts appreciated.. I can post any code required but as its the same as the tutorial maybe someone is already familiar with it..

Copyright Đ 2005-08 www.BigResource.com, All rights reserved