unidad de incremento en áreas/divs desplazables en javascript?

Question

en javascript puedo asegurar que mi gran div desplazamiento vertical sólo en trozos de (digamos) 16 píxeles

en Java, eso se llaman "unidades de la subasta.

No encuentro nada similar en javascript: Quiero asegurarme de que cierta área (div) cuando se desplaza parcialmente es siempre un múltiplo de 16 de la vista.

Eso me permite hacer trucos con imágenes de fondo y otros.

gracias

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/

Asegura rollos se realizan en múltiplos de 16 pixeles. Puede extender fácilmente esto para que sea un complemento que permita una cantidad variable (no un 16 fijo, mágico).

Answer 2

Sí, esto es posible, pero requerirá el uso de javascript para capturar el evento de desplazamiento y luego manipularla. Este script (lo siento jQuery es lo que tenía) y anula el evento de desplazamiento. Luego lo reemplaza con la misma distancia de desplazamiento exacta. Puede realizar su propia matemática para ajustar el valor de scrollTo. Tenemos que comprobar tanto la rueda del mouse como los eventos DOMMouseScroll porque FF no admite el primero. Esto no parece aplicarse en su caso, pero un usuario puede tener la cantidad de líneas para desplazarse configuradas en un valor distinto a los tres predeterminados. Entonces la instrucción if calcula la distancia. Lo dejé allí aunque en caso de que otras personas tropiecen con esta pregunta y, sin embargo, es importante para ellos.

$('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

Viniendo de otro lenguaje de programación, también encontré que JavaScript es difícil cuando se trata de UI. En su caso, simplemente establecería un controlador en el desplazamiento del evento y consultaría la posición del div en relación con la posición de desplazamiento. Devuelve falso cuando la posición de div no sea divisible por 16px y cree un contador para permitir la reposición después de que se haya desplazado 16px.