Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [JS] impress.js i scroll myszy
DawiT
post
Post #1





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 14.06.2013

Ostrzeżenie: (0%)
-----


Hej. Próbuje właśnie zrobić stronę opartą o impress.js ( https://github.com/impress/impress.js )
Głównie w impress'ie chodzi o to że strona obraca się (lewo, prawo, do góry nogami) dzięki CSS 3 transition.
Niestety (dla mnie) poruszanie się po stronie odbywa się za pomocą klawiszy tab, spacja i strzałki.
Ja bym chciał aby poruszanie się po stronie odbywało się za pomocą myszki, a dokładnie mówiąc kółka myszy.
Jeśli kręciłbym kółkiem w swoją stronę (tzn. w dół) strona by się przewijała dalej, a jeśli w drugą no to oczywiście w górę.
Kombinowałem
Kod
    $(window).scroll(function(){

});

Ale nie działa, gdyż tak na prawdę element body tak na prawdę się w ogólnie nie rusza (jest na całą wysokość okna przeglądarki)
więc moje zapytanie to:
czy jest coś w javascript/jQuery co by wykryło określony ruch kółka myszy mimo że body się nie rusza?
Go to the top of the page
+Quote Post
trueblue
post
Post #2





Grupa: Zarejestrowani
Postów: 6 806
Pomógł: 1828
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----


Zdarzenia mousewheel oraz DOMMouseScroll.
Go to the top of the page
+Quote Post
DawiT
post
Post #3





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 14.06.2013

Ostrzeżenie: (0%)
-----


Dzięki za odpowiedź. Naprowadziło mnie to już na właściwe tory.

Po wpisaniu kodu:
Kod
document.addEventListener( "wheel", function ( event){
            //alert(event); --> wyskakuje [object WhellEvent];
            console.log(event);
}


W konsoli jest obiekt WheelEvent ze zmiennymi takimi jaki IsTrued, deltaX, deltaY, deltaMode.
Zauwarzyłem że przy kręceniu kółkiem zmienia się deltaY.

Próbowałem z instrukcją warunkową z uwzględnieniem obiektu:
Kod
if( WheelEvent[deltaY] == "100" ) {
//cos;
}

Niestety konsola wyrzuca mi błąd undefined 'deltaY' :|
Co radzicie?
Go to the top of the page
+Quote Post
trueblue
post
Post #4





Grupa: Zarejestrowani
Postów: 6 806
Pomógł: 1828
Dołączył: 11.03.2014

Ostrzeżenie: (0%)
-----


Radzę skorzystać z Google.
https://www.sitepoint.com/html5-javascript-mouse-wheel/
Go to the top of the page
+Quote Post
DawiT
post
Post #5





Grupa: Zarejestrowani
Postów: 3
Pomógł: 0
Dołączył: 14.06.2013

Ostrzeżenie: (0%)
-----


Dzięki! (IMG:style_emoticons/default/smile.gif) Pomogło (IMG:style_emoticons/default/smile.gif)

Wklejam gdyby ktoś szukał:

Kod
                var e = window.event || e; // old IE support
            var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));


wtedy wartość z delti jest zapisywana w zmiennej var delta (IMG:style_emoticons/default/smile.gif)

Temat można zamknąć.
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 24.08.2025 - 19:32