inuyaksa / jquery.nicescroll

nicescroll plugin for jquery - scrollbars like iphone/ipad
https://nicescroll.areaaperta.com/
3.6k stars 1.67k forks source link

how to cancel click event on elements when dragging? #162

Closed ph0b0s closed 11 years ago

ph0b0s commented 11 years ago

Elements in scroll area have click event on them. When I drag an element it scrolls and triggers my click event.

How to cancel my click event when user is dragging and allow it only when user clicks once in place?

Seuthes commented 11 years ago

$(".yourDiv").mousedown(function (e) { window.mouseX = e.clientX; window.mouseY = e.clientY; }); $(".yourDiv").mouseup(function (e) { if (window.mouseX == e.clientX && window.mouseY == e.clientY && e.which == 1) { //e.which == 1 is left mouse button //this is clicked Element CallYourFunction(e, this); } });

inuyaksa commented 11 years ago

What browser do you use?

Seuthes commented 11 years ago

I don't know if ph0b0s has tried my code, but I had the same issue. I had it in different Browser-if not all-, in mobile and desktop.

My Code is a simple workaround, which works very well.

inuyaksa commented 11 years ago

Investingating..

inuyaksa commented 11 years ago

Click preventing has already implemented. Do you have an example code I can study?

ph0b0s commented 11 years ago

Thank you Seuthes. Your solution works perfect in my case. Sorry for the delayed response but my project has been on hold so I haven't had the chance to test it until today.

inuyaksa commented 11 years ago

Nice!

ph0b0s commented 11 years ago

@inuyaksa can we get those XY positions from nicescroll too? Is there a better way to do this with help of nicescroll functions/properties? I tried using "scrollrunning" property to detect when or if scrolling is active but I haven't been able to get that working.

inuyaksa commented 11 years ago

You can use

$("your-div").scrollTop()
$("your-div").scrollLeft()
blackzabaha commented 11 years ago

Hi, I just face this problem recently, too. Then I try to search around here for the solution, I think this also related to Issue #241 .

Seuthes' solution worked, but that also mean I have to apply that pattern to all my elements that need onClick binding. And there are many many elements on my page that require onClick binding. Could you just integrated this as default behavior of NiceScroll, or maybe one configurable option?

As I see no reason at all to fire click event on NiceScroll's children after scrolling end.

Thank you.

hmanprod commented 10 years ago

Hi. I am using the 3.5.4 version but it seems that i have the same problem as ph0b0s. I am using nicescroll + isotope. All items is bind to click event as the code below $(plugin.settings.item).click(function(){ console.log('click'); });

plugin.settings.item refer to the item class.

Seuthes commented 10 years ago

Did you try my workaround? I uses it massivly in my project as I have hundreds of elements that can be clicked.

hmanprod commented 10 years ago

Yeah. Good job. It's work. I'll gonna test it with mobile to see how does it work. Thanks Seuthes.

guinunez commented 10 years ago

Hi, I'm also on 3.5.4 and got the same issue, tested on opera, firefox and chrome under linux, also with firefox under android.

On opera it works fine, but all the other browsers had the issue.

I have a lot of click events, so Seuthes workaround is not the best option on my project