Wie können Sie die jQuery-Funktion scroll() ausführen, um eine zweite Funktion auszulösen?

Mein Versuch: https://codepen.io/alexyap/pen/gRLeVY?editors=1010 Wie können Sie die jQuery-Funktion scroll() ausführen, um eine zweite Funktion auszulösen?

$(document).ready(function(){ 

$(document).scroll(function(e){ 

e.preventDefault(); 

$("#mainContainer").css("transform", "translateX(-100vw)"); 

}) 


})

Diese mich treibt Nüsse. Ich versuche, meine Website horizontal um eine ganze Seite zu scrollen. Ich habe den ersten Teil herausgefunden, aber leider funktioniert er nach dem zweiten Scroll nicht mehr.

PS: von meinem Stift können Sie sehen, ich habe den Körper auf Überlauf versteckt, aber haben es auskommentiert (mein Code funktioniert nur, wenn ich es nicht so eingestellt habe).

Jemand bitte helfen Sie mir, dies herauszufinden.

Quelle

2017-06-16 Alex Yap

Können Sie bitte Ihre Frage bearbeiten, um das gewünschte Verhalten aus der Sicht des Benutzers besser zu beschreiben? Der angezeigte Code reagiert auf das Bildlaufereignis, indem er diese CSS-Transformation anwendet. – nnnnnn

Es tut mir leid, Englisch ist nicht meine erste Sprache, ich habe Probleme zu beschreiben, was ich erreichen will, aber im Grunde muss ich meine Website zuerst 100vw horizontal scrollen auf der ersten Bildlauf, und auf der nächsten Bildlauf eine weitere 100vw, tun Hast du Empfehlungen, wie ich meine Frage umformulieren kann? PS Ich fand einen Weg, um die Scroll-Arbeit btw mit dem Körper zum Überlauf ausgeblendet zu machen, statt scrollen() Ich benutze jetzt auf ("Mausrad") –

In Ihrem CodePen, habe ich nur e zwischen den Klammern in
$(document).on('mousewheel', function(e){

, das Ereignisobjekt an die Funktion übergeben wird.
Es wird benötigt, um das Rad Delta zu vergleichen.

Sie hatten es in der $(document).ready(function(e){, wo es nutzlos war.

Also hier ist Ihre CodePen updated einfach so.

Nur zum Spaß ... Ich habe es ein wenig mehr angepasst, indem ich voraussah, was jemand mit diesem "div translation" -Effekt ändern möchte.

Die erste Sache ist sicherlich die div-Menge.
Und die Übersetzung "Fraktion" wäre eine andere Sache ...
Und eine minimale Verzögerung zwischen jeder Übersetzung.

Also hier ist ein CodePen taking this in account.

Quelle

2017-06-16 07:30:16

kein Wunder hörte es auf, ich entfernte es, um etwas zu testen vor einer Weile und bemerkte nicht, dass ich es wieder an den falschen Ort, auch das einzige Problem ist jetzt, wie man es bekommen, so dass die folgenden Schriftrollen nicht feuern, es sei denn, die vorherigen Schriftrollen sind noch nicht fertig animiert, irgendwelche Ideen? und vielleicht auch ein anderer Ansatz, der nicht "glitchy" ist, habe ich manchmal bemerkt, wenn ich scrolle, nachdem ich gerade die Seite neu geladen habe, feuern die Animationen nicht sofort, es gibt eine Art "Verzögerung", denke ich .. –

Um Ihnen eine klare Vorstellung davon zu geben, was ich versuche neu zu erstellen, besuchen Sie bitte diese Website: http://10x16.com/ –

Wie können Sie die jQuery-Funktion scroll() ausführen, um eine zweite Funktion auszulösen?

Antwort

Verwandte Themen