Ok, I’ll try to explain what I’m trying to do as best as possible.
Using Webkit-overflow Scrolling I am creating a list with glassy headers, similar to the effect that the iPhone contact application gives. For instance. “A” remains at the top until “B” moves it, etc. This is relatively easy to do on the desktop or while the user is still scrolling.
However, as soon as the user clicks the scroller, it scrolls by itself with a slow deceleration, during this period no events are triggered until the scroller stops, by then it is too late.
After much research, I see that the duration of the slowdown is always the same (about 2.4 seconds), only the end position changes. I also see that many people get around this by creating their own library to mimic iOS behavior, which may be my only option.
I am trying to scroll the top element using, as it scrolls by itself, getting:
- Touch start position
- Touch end position
- Time difference between these two gestures
This should allow me to track the position and the end result before this happens. However, I am a little fixated on how to properly use this information to get the desired result. Any information or pointers would be extremely helpful.
EDIT
, , Physics stackexchange
, . , ,
var timeStart = new Date().getTime();
var timeEnd = new Date.getTime();
var startY = event.originalEvent.targetTouches.pageY
var endY = event.originalEvent.changeTouches[0].pageY
var timeElasped = timeEnd - timeStart;
var distance = startY - endY;
var velocity = distance/timeElasped;
var result = velocity * (timeElasped - (1/4.8)*(timeElasped*timeElasped))
, , scrollTop, .
2
, , . .
, , , .
3
, 0,95 325 . .
, - . . : ( ?) . . , - spring -mass. , - .
amplitude = initialVelocity * scaleFactor;
step = 0;
ticker = setInterval(function() {
var delta = amplitude / timeConstant;
position += delta;
amplitude -= delta;
step += 1;
if (step > 6 * timeConstant) {
clearInterval(ticker);
}
}, updateInterval);
, , PastryKit Apples ( iAd). 0,95 (16,7 , 60 ). 325 . , , , , . scriblling, , 325 -16,7/ln (0,95).
Google Doc , , . - . 0,95 ( * 0,95). , , . , .
EDIT 4
, webkit safari mobile. JS lib , .