scrollIntoView无法在Chrome上运行,但在Firefox中完全没问题

问题描述 投票:0回答:1

我已经遇到了有关scrollIntoView的问题。我写的代码适用于Firefox,但不适用于Chrome。我没有从控制台得到任何错误或任何东西因此我不知道是什么问题。如何在Chrome上正确运行?我想在Vanilla JS中解决它

这是我的代码 - > https://codepen.io/Rafi-R/pen/PLdvjO

const body = document.querySelector('body');
const links = document.querySelectorAll(".link");
let section = 0;

const scrollDirection = e => e.wheelDelta ? e.wheelDelta : -1 * e.deltaY;

const scrollToSection = e => {
    e.preventDefault();
    section = 
        scrollDirection(e) < 0 
        ? (section + 1 >= links.length - 1 ? section = links.length - 1 : section + 1) 
        : (section - 1 <= 0 ? section = 0 : section - 1);   

    let element = document.querySelector(links[section].getAttribute("href"));
    scrollToTheView(element);
}

const scrollToTheView = el => {
    el.scrollIntoView({ behavior: 'smooth' });
    console.log(el, links[section].getAttribute("href"), section)
}

body.addEventListener('wheel', scrollToSection, { passive: false });

当codepen的控制台打开时,qazxsw poi崩溃了qazxsw poi,这个滚动不起作用。

javascript js-scrollintoview
1个回答
0
投票

你没有说你期望发生什么,但你的代码似乎对我来说很好。每次向下滚动鼠标滚轮后,下一部分将滑入视图。

这是在Ubuntu上的Chrome 73.0.3683.86。


0
投票

Chrome不接受console.log()方法中的所有选项。我遇到了类似的问题,发现如果你改变这些选项的值,它似乎工作正常。

scrollIntoView({behavior: 'smooth'})

上面的片段正在为我水平滚动元素

scrollIntoView

© www.soinside.com 2019 - 2024. All rights reserved.