javascript - 过渡和自动滚动 div

标签 javascript jquery html css

我创建了一个包含不同部分的 HTML 页面。每个部分都包含在一个 DIV 中。我的要求是在每个 div 之间进行转换。例如,几秒钟后,section1 模糊,section2 模糊,依此类推。现在在一个特定的部分中,我希望该部分的内容从下到上自动滚动,直到到达该部分的末尾。我能够在不同部分之间创建切换,但无法滚动每个部分的内容,例如,第一部分自动滚动,当到达部分末尾时,它只会转到另一个部分,然后滚动.有人可以帮我吗?我已经在下面的链接中粘贴了我的代码,

http://pastebin.com/rE8h5NK0

此外,我已经为每个部分标题指定了固定位置,但是当我最小化页面时,标题没有正确对齐。如果我不修复它,它就不会在页面上正确显示。

最佳答案

我建议在循环中运行 JQuery scrollTop,通过将 div 的高度减去容器的高度与滚动量相匹配来查找滚动何时到达底部:

function scroll() {
    if ($('#div').scrollTop() == $('#div').height() - $('#container').height()) {
        scrollInterval.clearInterval();
        // Transition to next section
    } else {
        $('#div').scrollTop($('#div').scrollTop() + 1);
    }
}

var scrollInterval = setInterval(scroll,20 /* Scroll speed */);

关于javascript - 过渡和自动滚动 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15075861/

相关文章:

html - div 的内容未居中对齐

javascript - jQuery.on();与 JavaScript .addEventListener();

javascript - 类型 'products' 上不存在属性 'Readonly<{}>'

css - IE7 错误 - span 覆盖了链接

javascript - 如果选择单选按钮 Show Div - 8 Radio Buttons/8 Divs - 这可以简化吗?

jquery - 通过单击将 span 标签替换为多个链接

jquery - 如何使用jQuery的replaceWith()顺利替换它

javascript - 使用javascript递归地计算文本节点

javascript - 如何在循环的 django 模板中创建唯一的 javascript 变量名?

javascript - 印度货币的输入掩码在 Jquery 动态输入字段中