我正在构建一个使用该react-scroll
库的网站,并且正在使用该Link
组件来激活某些转换。我正在使用该duration
属性,它在 Chrome 上运行良好,但是当我在 Firefox 上测试网站时,持续时间不会改变并且运行速度明显快于它在 Chrome 上的运行速度。这是我的代码:
<Link
activeClass="active"
to={this.state.prevSectionId}
spy={true}
onSetActive={() => this.handleSectionChange(-1)}
duration={1000}>
<FontAwesomeIcon icon={faChevronUp} size="lg" />
我还有一个自定义button
滚动到页面顶部,并且在 Firefox 中的动画速度也比在 Chrome 中快得多,没有设置持续时间:
<div id="scrollToTopButtonWrapper">
<button onClick={() => window.scrollTo(0, 0)}>
<FontAwesomeIcon icon={faArrowCircleUp} size="4x" />
</button>
</div>
此问题与其他动画一起影响网站的功能,但根本原因是运行所需的持续时间。