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

Javascript how to set interval time to stop scrolling

本文关键字：滚动 时间 何设置 设置 Javascript      更新时间：2023-09-26

这是jsfiddle中的演示，演示

我想要的是让滚动的项目（"一个"、"两个"、‘三个’、‘4’、‘5’、‘6’、‘7’）像演示一样自动向上滚动，当它位于中间位置时停止2秒。但在我的演示中，它在停在中间位置后会有一段时间。

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

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的值在（31251）之间。当每个项目都在位置中间时，你知道如何找到准确的位置吗？谢谢

我修改了你的代码一点，

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

对我来说很好看->http://jsfiddle.net/ato0mf7u/3/再也没有搞笑的沙金了-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);
}
相关文章：