为什么延迟加载部分会创建溢出_x

Question

您好，我有一个问题，我正在尝试使我的页面 RWD，但问题是当 interSectionObserver 加载部分时它会创建溢出_x，它会导致页面上的定位消失，但是当它到达页面末尾时，一切都已修复.更多代码可以在我的 github 上找到，但我不确定我是否有权粘贴它。

CSS

.section {
   transition: opacity 1s, transform 1s;
}
.hidden-section {
    opacity: 0;
    transform: translateY(7rem);
}

JS：

        
        _revealSection() {
                const sections = document.querySelectorAll('.section');
                const options = {
                    root: null,
                    threshold: 0.15,
                    rootMargin: "0px",
                }
        
                const showSection = ((entries, observer) => {
                    const [entry] = entries;
                    if (!entry.isIntersecting) return 
                    entry.target.classList.toggle('hidden-section')
                    observer.unobserve(entry.target)
                    
                })
        
                const sectionFadeIn = new IntersectionObserver(showSection, options);
        
                sections.forEach(sec => {
                    sec.classList.add('hidden-section')
                    sectionFadeIn.observe(sec)
                } )
            }

HTML:

    <section class="section" id="section--5">
                <div class="contact">
                    <h1 class="contact__header">Are you ready for an new experience?</h1>
                    <button class=" modal-button contact__button" data-but="4">contact us</button>
                </div>

Answer 1

好的，问题出在 html 和 body 标记中。

html, body {
width: 100;
overflow-x: hidden;
 }