主页 / user-449579

George Marco's questions

Martin Hope
George Marco
Asked: 2022-07-11 03:55:07 +0800 CST
  • 0

大家好！我在控制台中收到永久更新，但出现错误。（代码中的示例）。是否可以在没有无休止的 requestAnimationFrame 调用的情况下实际使用它，或者是否有其他更简洁、更宽敞的优化解决方案，告诉我？谢谢！

在此处输入图像描述

const
    body = document.body,
    scrollWrap = document.getElementsByClassName("main")[0],
    height = scrollWrap.getBoundingClientRect().height - 1,
    speed = 0.1;

var offset = 0;

body.style.height = Math.floor(height) + "px";

function smoothScroll() {
    offset += (window.pageYOffset - offset) * speed;

    var scroll = "translateY(-" + offset + "px) translateZ(0)";
    scrollWrap.style.transform = scroll;

    callScroll = requestAnimationFrame(smoothScroll);
}

smoothScroll();
<body>
  <div class="main" style="display: flex; flex-direction: column; width: 100vw; height: 200vh">
    <span>Text</span>
    <div style="width: 10vw; height: 20vh; background-color: #000000"></div>
    <span>Text</span>
    <span>Text</span>
        <div style="width: 10vw; height: 20vh; background-color: #000000"></div>
    <span>Text</span>
  </div>
<body>

javascript scroll