jednostka przyrostu w przewijanych obszarach/działach w javascript?

Question

w javascript mogę mieć pewność, że mój duży div przewijania w pionie tylko w kawałki (powiedzmy) 16 pikseli

w Javie, te nazywane są "jednostki przyrostu.

Nie mogę znaleźć niczego podobnego w javascript: Chcę się upewnić, że określony obszar (div), gdy jest częściowo przewinięty, jest zawsze wielokrotnością 16 widoku.

To pozwala mi robić sztuczki z obrazami tła i innymi.

dzięki

Answer 1

var lastScroll = 0; 
$('div').scroll(function(){ 
    var el = $(this), 
     scroll = el.scrollTop(), 
     round = lastScroll < scroll ? Math.ceil : Math.floor; 
    lastScroll = round(scroll/16) * 16; 
    el.scrollTop(lastScroll); 
}); 

http://jsfiddle.net/m9DQR/2/

Zapewnia zwoje są wykonywane w wielokrotności 16 pikseli. Możesz łatwo rozszerzyć to na wtyczkę, która pozwala na zmienną kwotę (nie jest stała, magiczna 16).

Answer 2

Tak, to jest możliwe, ale będzie to wymagało przy użyciu javascript, aby uchwycić zdarzenia przewijania, a następnie manipulować. Ten skrypt (przepraszam jQuery jest tym, co miałem) i nadpisuje zdarzenie przewijania. Następnie zastępuje go dokładnie taką samą odległością przewijania. Możesz wykonać własną matematykę, aby dostosować wartość scrollTo. Musimy sprawdzić zdarzenia kółka myszy i DOMMouseScroll, ponieważ pierwszy nie jest obsługiwany przez FF. Wydaje się, że nie ma to zastosowania w twoim przypadku, ale użytkownik może mieć liczbę linii do przewinięcia ustawioną na coś innego niż domyślne trzy. Tak więc instrukcja if oblicza odległość. Zostawiłem to tam, na wypadek, gdyby inni ludzie natknęli się na to pytanie i jest to dla nich ważne.

$('body').bind('mousewheel DOMMouseScroll', function(e) { 
    var scrollTo = null; 
    if (e.type == 'mousewheel') { 
    scrollTo = (e.wheelDelta * -1); 
    } 
    else if (e.type == 'DOMMouseScroll') { 
    scrollTo = 40 * e.detail; 
    } 
    //adjust value of scrollTo here if you like. 
    scrollTo = 16; 
    if (scrollTo) { 
    e.preventDefault(); 
    $(this).scrollTop(scrollTo + $(this).scrollTop()); 
    } 
}); 

Answer 3

Pochodząc z innego języka programowania, stwierdziłem również, że JavaScript jest trudny w obsłudze interfejsu użytkownika. W twoim przypadku po prostu ustawiłbym handler do zdarzenia onscroll i zapytałbym pozycję div w stosunku do pozycji przewijania. Zwróć wartość false, gdy pozycja elementu div nie jest podzielna przez 16 pikseli i utwórz licznik, aby umożliwić zmianę położenia po przewinięciu kolejnego 16 pikseli.