This bugged me today, and I couldn't find a solution for it.. so I'm just putting this out there..
You see what I want is for the text to be inserted into the textArea and have the scrollbar automatically scroll down to the bottom. By default it doesn't do that.. so I used the
vPosition = maxVPosition;
code and that scrolls the text all the way down, but the scrollbar doesn't quite go all the way down.. there's apparently a slight delay in the value of maxVPosition being changed (so if you press the setScrollPosition button you'll call the setScrollPosition again and see that the scrollbar correctly goes all the way to the bottom).
The hack I came up with was just to set an Interval for about 100ms and then set the position of the scrollbar again. Sigh.. I'm sure others have gone through this and found a better hack. Maybe there's a way to detect when the maxVPosition has finally been set? I think I remember coming across this issue with the scrollPane component as well.
oh..
function setScrollPosition() {
with (myTextArea) {
vPosition = maxVPosition;
}
}
textArea scroll jumping Tuesday, August 31, 2004
Have Your Saycomments & trackbacks
The trackback URL for this entry is: http://oddhammer.com/index.php/trackback/82/wQS5MSSe/
01 Sep 2004 at 03:18 am | #
Hello mike,
use the doLater function like this:
function setScrollPosition() {
with (myTextArea) {
vPosition = maxVPosition;
}
}
var addTextButtonListener = new Object();
addTextButtonListener.click = function(eventObj) {
var target = eventObj.target;
addText();
target.doLater(target._parent, "setScrollPosition");
};
addTextScroll_btn.addEventListener("click", addTextButtonListener);
or
addTextScroll_btn.onRelease = function() {
addText();
myTextArea.doLater(this._parent, "setScrollPosition");
};
Philippe
01 Sep 2004 at 05:14 am | #
Thanks Philippe! I tried using doLater, but the new text flashes at the bottom of the textArea.. it's kind of a tradeoff whether to have the new text flash at the bottom of the textArea for a moment, or have the scrollbar jump slightly a moment after the text has been added (what I see when I update scrollPosition using a setInterval)
01 Sep 2004 at 07:29 pm | #
I tinkered with this a little more tonight.. and found that if the text area is "editable" then I see the flicker of new text before the textArea updates.. but if I set myTextArea.editable = false then it works very cleanly. I've updated the example to show this.. you can toggle the textArea to either editable or not and then use the "add text and doLater" button.
28 Sep 2004 at 08:59 pm | #
An alternative is to use vPosition = maxVPosition + 100 or some number that is greater than the length of the text added. That way you will always end up at the end and you don't need to delay. The way VPosition works is that if you give it a number greater than maxVPosition it won't stuff up, it'll just go to the very end.
07 Mar 2006 at 01:17 pm | #
Thanks for the code... I was working on a solution for the last few hours and it seems that no one on the internet had our problem. It's the first page that I find with an actual - and functional - solution.
07 Mar 2006 at 02:06 pm | #
oh.. you might also take a look at .onComplete() .. I was fighting a problem witha ScrollPane that wouldn't scroll all the way to the bottom after I increased the size of the clip that was loaded into it (I had a clip in the scrollpane and made it taller after the scrollpane initialized and then the scrollbar wouldn't scroll all the way down). Calling .onComplete() forced the scrollbar to recalculate the total height.
also.. I don't know what I was thinking when I used the with() in the code above..
myTextArea.vPosition = myTextArea.maxVPosition;
should work as well and not use that nasty "with( )"
30 May 2007 at 02:17 pm | #
Still, didn't you feel happy to know that you came across that idea yourself instead of taking someone else's? It a step forward, a small step for mankind, a big step for the man