乐趣区

关于html+css+js:把可滚动区域中某个子元素平滑滚动到可视区域正中间位置

如何把可滚动区域中 - 某个子元素平滑滚动到可视区域正中间地位

不废话,间接上公式:

    // parentEl 代表父元素,也就是设置了 overflow 为可滚动的元素
    // childEl 代表须要滚动到父元素正中间的间接子元素

    // 程度滚动
    let x = childEl.offsetLeft - parentEl.clientWidth + parentEl.clientWidth/2 + childEl.clientWidth/2;
    parentEl.scrollTo({
        left: x,
        behavior: "smooth",
    });

    // 垂直滚动
    let y = childEl.offsetTop - parentEl.clientHeight + parentEl.clientHeight/2 + childEl.clientHeight/2;
    parentEl.scrollTo({
        top: y,
        behavior: "smooth",
    });
退出移动版