Question

因此,我使用的法典是滚动的(我希望它不会太坏,我只有大约4天的经验才这样做)。

const ScrollDelay = 130;

var LastScrollTime = Date.now();
var NewScrollTime = Date.now();
var IsScrolling = false;
var CurrentPage;

function GotoPage(PageNumber) {
    PageNumber = Math.min(Math.max(PageNumber, 1), 5);
    
    if (CurrentPage == PageNumber) {
        return false;
    }
    
    document.getElementById("Page"+PageNumber).scrollIntoView({behavior: "smooth", inline: "center"})
}

function ScrollStart(Wheel) {
    NewScrollTime = Date.now();
    
    if (!Wheel) {
        return false;
    }
    
    Wheel.preventDefault(Wheel);
    Wheel.stopPropagation(Wheel);
    
    if ((NewScrollTime - LastScrollTime) < ScrollDelay || IsScrolling == true) {
        return false;
    }
    
    IsScrolling = true;
    
    if (Wheel.deltaY < 0) {
        GotoPage(CurrentPage - 1);
    } else {
        GotoPage(CurrentPage + 1);
    }
    
    LastScrollTime = Date.now();
    return false;
}

function ScrollEnd() {
    CurrentPage = Math.min(Math.max(Math.round(window.scrollY / innerHeight) + 1, 1), 5);
}

window.onload = function() {
    CurrentPage = Math.round(window.scrollY / window.innerHeight) + 1;
}

window.addEventListener("wheel", ScrollStart, {passive: false});

document.onscrollend = (event) => {
    ScrollEnd();
    IsScrolling = false;
};

* {
    font: 16px Verdana, sans-serif;
    padding: 0px;
    margin: 0px;
}



:root::-webkit-scrollbar {
    width: 0;
    height: 0;
}

/* ------------------------------------------------------Pages------------------------------------------------------ */

.PageContainer {
    padding: 0;
    margin: 0;
}

.Page {
    width: 100%;
    height: 100vh;
    padding: 0;
    margin: 0;
}

#Page1 {
    background-color: darkred;
}

#Page2 {
    background-color: green;
}

#Page3 {
    background-color: purple;
}

#Page4 {
    background-color: darkblue;
}

#Page5 {
    background-color: brown;
}

<!DOCTYPE html>
<html lang="en">
    <head>
        <link rel="stylesheet" href="index.css">
    </head>
    <body>
        <script src="Main.js"></script>
        <div class="PageContainer">
            <div class="Page" id="Page1"></div>
            <div class="Page" id="Page2"></div>
            <div class="Page" id="Page3"></div>
            <div class="Page" id="Page4"></div>
            <div class="Page" id="Page5"></div>
        </div>
    </body>
</html>

它本应在多栏页之间顺利进行滚动,但是它并没有像在火焰上那样做。

通常,如果你只把一只 not子推向滚动轮,但做的事情不止一次。

这正是它应当如何工作(在 go角角/a)

这就是它如何在火f()上工作。

这里是整个现场的 file。如果不允许我这样说,或者说有更好的选择,那么,让我知道,我会把它固定下来。

There are no errors and I have no idea how to fix this, I ve tried looking for problems similar to mine but haven t been able to find any because I don t even know what to call it.

https://codepen.io/Rax-Rax/pen/qBQLxgd”rel=“nofollow noreferer”> Edit:I made a Codepen for it

Answer 1

I am not sure exactly how your code works it but I heard there s a lot of issues and features that are not supported correctly on firefox for everything related to web pages.

友情链接