Question

我正在尝试制作一个流畅的javascript动画，让div从屏幕上的900位置滑动到550.

有两个变量;地点和速度，我用地方来找到div在屏幕上的位置，以及确定速度的速度。

为了让这个好看又流畅，我试图让速度变得越来越慢，所以幻灯片开始变得越来越慢。

我不知道我是不是想在这里做正确的事，但基本上，我希望速度从100％开始，比如50 px，并且每次都要慢一些。

速度百分比应该等于我的位置数。

所以那个地方从900开始，到550结束。速度应从50开始，每次减慢百分比，结束时为0，因为地点结束于550 ...

如何设置???

我试过这个：

function doit(place, speed, proc) {
    var denne = document.getElementById("screen1");
    if (place > 550) {
        var speedproc = 100 - (place / 950 * 100); // (the reason that I'm using 950 here is because it should have a percentage to start from that isn't 0)
        var newspeed = speed - (speed / 100 * proc);
        speed = newspeed;
        proc += speedproc;
        place -= speed;
        denne.style.marginLeft = place + "px";
        setTimeout("doit(" + place + ", " + speed + ", " + proc + ")", 20);
    }
}

身体：

<body onload='doit(900, 50, 0);'>

但它表现得很疯狂......我做错了什么？

Answer 1

总而言之，我会做这样的事情来创造减速效果：

newspeed = speed*proc; //Now, proc is a number between 0 and 1.
//the closer proc is to 1, the smaller the decrease will be.
// when proc is 1 - there will be no decrease in speed

例如：

<body onload='doit(900, 50, 0.9);'>

Javascript动画 - 数学问题

1 个答案: