jQuery evitar que el evento de clic se active al desplazarse por un div

Question

Suena fácil, ¿verdad? Pero estoy usando un control de desplazamiento personalizado (http://github.com/inuyaksa/jquery.nicescroll) y he probado la mayoría de los trucos que he visto para evitar esto cuando uso draggable(). Pero ellos no están trabajando para esto ... he subido la página y el código aquí:

Demostración: http://www.beforethecode.net/blazin Fuente: http://www.beforethecode.net/blazin/blazin.zip

Se trata de un proyecto de la pantalla táctil. Hasta ahora, mi única solución era unir los $ pulgares a 'dblclick' para que dejara de disparar después de arrastrar el mouse/dedo ... Pero realmente me gustaría que funcione con un solo clic después de que el desplazamiento se haya detenido.

Answer 1

Su mejor opción será una solución similar a la cantidad completa automáticamente a trabajar cancelación de eventos nativos y el uso de los tiempos de espera y banderas a solamente actuar bajo circunstancias deseadas lugar:

1. event.preventDefault() evento "click" en los controles relacionados, <a /> etiquetas , etc. (es decir, no permita que ocurra ningún comportamiento del navegador nativo relacionado con el clic de activación).
2. Al hacer clic en el evento después de evitar el valor predeterminado, ponga la acción de hacer clic en un pequeño setTimeout y guarde el identificador de tiempo de espera.
3. En el evento "stopdrag", borre el manejador de tiempo de espera; esto ocurrirá teóricamente durante el período de tiempo de espera del evento "clic" y evitará que ocurra un clic después de un stopdrag lógico, mientras que en un clic real no habrá stopdrag para cancelar el tiempo de espera (entonces la acción se realizará como se desee).

Código:

var clickActionTimeout = null; 

function clearClickActionTimeout() { 
    if(clickActionTimeout) { 
    clearTimeout(clickActionTimeout); 
    clickActionTimeout = null; 
    } 
} 

$elem.click(function(e) { 
    e.preventDefault(); 
    clearClickActionTimeout(); 
    clickActionTimeout = setTimeout(function() { 
    // This was a real click if we got here... 
    openPicture(); 
    }, 200); 
}); 

$elem.bind('stopdrag', function() { 
    clearClickActionTimeout(); 
}); 

Answer 2

no trabajo con esta biblioteca, pero tal vez esto le ayuda. Como obtención, no es para dispositivos móviles, es para pantallas táctiles. Todo el trabajo está bien en mi teléfono, el desplazamiento está bien.

Tiene algunas propiedades de configuración, y algunas parecen solo para sus necesidades. Aquí algunos de ellos:

. Comportamiento táctil: habilite el desplazamiento del cursor y arrastre como dispositivos táctiles en la computadora de escritorio, el valor predeterminado es falso

. cursordragontouch, arrastre el cursor en el modo táctil/touchbehavior también (por defecto: falso)

https://github.com/inuyaksa/jquery.nicescroll/blob/master/README

no veo su código, su enlace está roto, tal vez usted ya sabe acerca de estas propiedades. Pero si no, espero que esto te ayude. Esto es solo encontrar el nido de una yegua.

Answer 3

No sé cómo administrar los eventos táctiles. Sin embargo, así es como lo haría para hacer clic en eventos y supongo que no es muy diferente de los http://jsfiddle.net/USvay/

La idea es evitar el evento click y en su lugar su función de deseo se activará en mouseup si un tiempo determinado tiene o no pasado.

var clicked = true, 
    tOut; 

$('a').on('click', function (e) { 
    e.preventDefault(); 
}).on('mousedown', function() { 


    tOut = setTimeout(function() { 
     clicked = false; 
    }, 200); 



}).on('mouseup', function() { 

    if (clicked == true) { 
     clearTimeout(tOut); 
     my_function(); 

    } else { 
     clicked = true; 
     $('<p>Dragged</p>').appendTo('#result'); 
    } 

}); 

function my_function() { 
    $('<p>Clicked</p>').appendTo('#result'); 
} 

Answer 4

Ha intentado:

event.stopPropagation() 

Aquí está la reference on this function.