Streaming live at 10am (PST)

No click event if mouse moves a few pixels?

Hi all! Glad to be here; and for the first time.

The two requested links for my project are:
[1]: https://desk2.webflow.io
[2]: Webflow - desk2

This is my first Webflow learning project, I’m creating a graphical “Pizza Builder”. The one problem I’m having occurs when clicking topping to add them. If the mouse moves only a few pixels during the click, the picture does not receive the click event! (At least, no click-event shows in the Chrome console where I expect it.) My guess is that the click is being turned into a drag event.

This is an example of the JavaScript I’m using that responds to the click events, located “Before tag”:

$( ‘.banana-s’ ).click(function() {
$(’.banana-s’ ).addClass(‘add’);
$(’.banana-pepper’ ).addClass(‘fade’);
});
$( “.banana-b” ).click(function() {
$(’.banana-s’).removeClass(‘add’);
$(’.banana-pepper’ ).removeClass(‘fade’);
});

Unless Webflow provides a more direct method, what I need is a way for JavaScript to respond when the mouse is clicked down, and then up again anywhere on the same image, even if the mouse has moved over a number of pixels in the process.

Tommy Paul

I’m not really seeing this problem in Chrome? The click goes through just fine even if I’m moving the cursor around.

Thanks for the reply, Fonsume. It’s good that some others (if not most others) don’t experience the problem. So now I need to look for “Why here and not there?”

UPDATE: I’m developing on Windows, so just tried the link I sent you on an Apple. The result was the same problem. At first I thought it was working, but then I realized at then end of moving I’d let the mouse button up and clicked down a second time (and it worked because the mouse wasn’t moving during the second click down and up). Are you sure this didn’t happen to you too?