Ich versuche, die eine Seite auf dem Mausrad zu scrollen. Wenn Sie mit der Maus nach unten gehen, bewegt sich der untere Abschnitt nach oben und mit der Maus nach oben bewegt sich der obere Abschnitt nach unten. Es gibt fünf Abschnitte und ich benutze Variable 'a' mit Anfangswert als 1, auf mousedown eine Schritte und sendet den Wert als ID des Abschnitts (zB: a = 2, document.getElementbyId(a)
sollte den Abschnitt 2 aufrufen). Dies ist das erwartete Ergebnis. ganze Seite blättern basierte basierend auf Mausrad
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<style>
section { height: 100vh;
border:1px solid black; }
.pushupsections{
margin-bottom:-100vh;
}
</style>
</head>
<body>
<section id=1>1</section>
<section id="2">2</section>
<section id="3">3</section>
<section id="4">4</section>
<section id="5">5</section>
<script>
$(document).ready(function() {
var a=1;
$('body').bind('mousewheel', function(e){
// var e;
if(e.originalEvent.wheelDelta /120 > 0) {
// alert(1);
if(a>1){
a--;
//$(a).addClass("pushupsections");
// document.getElementById(a).addclass("pushupsections");
}
}
else{
if(a<5){
a++;
// document.getElementById(a).addclass("pushupsections");
}
}
});
});
</script>
</body>
</html>
Vielen Dank für die Lösung. Aber der Effekt, den ich suchte, ist wie in www.thepetedesign.com/demos/onepage_scroll_demo.htm – vineeth