Javascript如何设置停止滚动的间隔时间

这是JSFIDLE中的演示

我希望让滚动的条目（“一”、“二”、“三”、“4”、“5”、“6”、“7”）像演示一样自动向上滚动，在中间位置停止2秒。但在我的演示中，在中间位置停止后，它会停顿一段时间。

if ((x == 0) || (x % 35== 0)) {
    setTimeout(function () {
        i.top = x + 'px';
    }, 1000);
} else {
    i.top = x + 'px';
}

这是我的演示代码中设置位置的位置

if ((x == 0) || (x % 35== 0)) {
    setTimeout(function () {
        i.top = x + 'px';
    }, 1000);
} else {
    i.top = x + 'px';
}

有人能帮我吗？谢谢

更新：

---

我之所以设置35是因为我发现滚动项目大约在中间位置，当它等于0，-35，-70，-105，…但是当我操控所有的x时，我发现x的值在（31，-251）之间。当每个项目处于中间位置时，你知道如何找到确切的位置吗？谢谢

我稍微修改了你的代码

我设置了一个变量“k”，将间隔分配给该变量，并在停止时清除该间隔，然后在超时后再次启动它

看起来很适合我-> 不再有有趣的沙金-D

window.onload = addScrollers;


var i = 1;
var arr = ['one ', 'two', 'three', '4', '5', '6', '7'];
var mid;
var k;
function addScrollers() {

    var txt = arr[0];
    while (i < arr.length) {
        txt += '<p>' + arr[i] + '</p>';
        i++;
    }
    startScroll('myscroller', txt);

}

var speed = 10; // scroll speed (bigger = faster)
var dR = false; // reverse direction

var step = 1;
function objWidth(obj) {

    if (obj.offsetWidth) return obj.offsetWidth;
    if (obj.clip) return obj.clip.width;
    return 0;
}
function objHeight(obj) {

    if (obj.offsetHeight) return obj.offsetHeight;
    if (obj.clip) return obj.clip.height;
    return 0;
}
function scrF(i, sH, eH) {
    var x = parseInt(i.top) + (dR ? step : -step);
    if (dR && x > sH) {
        x = -eH;
    } else if (x < 1 - eH) {
        x = sH;
    }
    //when x is the times of 35, the positio is in middle
    if ((x == 0) || (x % 35== 0)) {
        clearInterval(k);
        setTimeout(function () {
            i.top = x + 'px';
            k = setInterval(function () {

             scrF(i, sH, eH);
             }, 1000 / speed);
        }, 1000);

    }
    else {
        i.top = x + 'px';
    }
    return x;
}
function startScroll(sN, txt) {


    var scr = document.getElementById(sN);
    var sW = objWidth(scr);
    var sH = objHeight(scr);
    scr.innerHTML = '<div id="' + sN + 'in" style="position:absolute; left:3px; width:' + sW + ';">' + txt + '<\/div>';
    var sTxt = document.getElementById(sN + 'in');
    var eH = objHeight(sTxt);

    mid = (eH - sH) / 2;

    sTxt.style.top = (dR ? -eH : sH) + 'px';
    sTxt.style.clip = 'rect(0,' + sW + 'px,' + eH + 'px,0)';


    k = setInterval(function () {

        scrF(sTxt.style, sH, eH);
    }, 1000 / speed);

}

window.onload=addScrollers；
var i=1；
var arr=['1'，'2'，'3'，'4'，'5'，'6'，'7']；
var-mid；
var-k；
函数addScrollers（）{
var txt=arr[0]；
而（i'；
i++；
}
startScroll（'myscroller'，txt）；
}
var速度=10；//滚动速度（越大=越快）
var dR=false；//反向
var阶跃=1；
功能objWidth（obj）{
如果（obj.offsetWidth）返回obj.offsetWidth；
if（obj.clip）返回obj.clip.width；
返回0；
}
功能OBJHight（obj）{
如果（obj.offsetHeight）返回obj.offsetHeight；
如果（obj.clip）返回obj.clip.height；
返回0；
}
功能scrF（i、sH、eH）{
var x=parseInt（i.top）+（dR？步骤：-步骤）；
如果（dR&&x>sH）{
x=-eH；
}否则如果（x<1-eH）{
x=sH；
}
//当x是35的倍数时，位置在中间
如果（（x==0）| |（x%35==0））{
净间隔（k）；
setTimeout（函数（）{
i、 顶部=x+‘px’；
k=设置间隔（函数（）{
scrF（i，sH，eH）；
}，1000/速）；
}, 1000);
}
否则{
i、 顶部=x+‘px’；
}
返回x；
}
功能启动滚动（序列号，文本）{
var scr=document.getElementById（序号）；
var sW=objWidth（scr）；
var sH=重量（scr）；
scr.innerHTML=''+txt+''；
var sTxt=document.getElementById（sN+'in'）；
var eH=重量（sTxt）；
中期=（eH-sH）/2；
sTxt.style.top=（dR？-eH:sH）+‘px’；
sTxt.style.clip='rect（0，+sW+'px，+eH+'px，0'）；
k=设置间隔（函数（）{
scrF（sTxt.style，sH，eH）；
}，1000/速）；
}

沙金看起来很有趣是的，很有趣。这似乎是因为setTimeout和setInterval之间的冲突时间（在我的代码底部）+1用于有趣的抖动：请帮我找出答案。谢谢！你应该考虑为你的变量使用更多描述性的名字。我不知道发生了什么事情，所以我不知道我能帮助你。这很好，但是为什么要重置超时内的间隔呢？它让我很困惑，不，间隔时间更正了！我刚刚开始了。n继续，实际上您根本不需要间隔，只需调用scrF（）再次，在timeoutWell之后，你需要间隔，否则它只会移动1个位置，不是吗？为什么清除间隔会起作用似乎仍然很奇怪。至少在我看来startScroll中的间隔只调用了35次，从那时起，我清除它，因为否则它在超时期间仍会运行（这使得有趣的反弹），超时后，scrF中的间隔开始35次，清除和超时一次又一次。重要的是，在超时期间没有间隔运行…这就是为什么清除它并再次启动它是解决方案。感谢解释，这对我现在来说非常有意义！我不认为间隔在暂停了，我真是太蠢了。