Custom events 'movestart', 'move' and 'moveend' for jQuery.

https://jquery.com/upgrade-guide/3.0/#breaking-change-jquery-event-props-and-jquery-event-fixhooks-removed

jQuery's event handling performance increased thanks to a reorganization of event property management. The main improvement is that jQuery now only calculates or copies a property on the first access, rather than calculating and copying them up front. This is a really big win with properties that may force layout that the event handler may not even need. The most common use we know of was to add properties for pointer events, which is no longer necessary because those events are supported already in jQuery 3.0. The jQuery Migrate plugin provides support for these properties if you still need them. The related but undocumented mouseHooks and keyHooks lists were removed as well. The team is interested in understanding other use cases before defining new APIs, so feel free to open a ticket.

I'm trying to use jquery.event.move.js v1.3.1 with Zurb Foundation's Clearing gallery, but when the plugin is in place, the scroll bar is inoperable in Chrome...

I know it is a feature to not have the 'movestart' event fire until there is a move but I need that event raised before there is any move for my own purposes. Looked at the code and there is a threshold value set to 6 which I thought if I set it to 0 would do the job but no. I even removed the code in the checkThreshold() that short circuits the function but no luck.

What do I need to do to get the movestart event immediately on pointer down? or maybe fix it so threshold = 0 behaves as expected.

Hi,

after playing a little with your plugin, I found what seems a bug. Here is an output of some Chrome logging :

This is just a copy of some consecutive move event properties.

Object {delta: 0, y: 680, start: 686, dist: -6} 
Object {delta: -1, y: 679, start: 686, dist: -7} 
Object {delta: -1, y: 664, start: 686, dist: -22} 
Object {delta: -7, y: 656, start: 686, dist: -30} 
Object {delta: -7, y: 648, start: 686, dist: -38} 
Object {delta: -6, y: 641, start: 686, dist: -45} 
Object {delta: -1, y: 635, start: 686, dist: -51}

deltaY is not coherent with other values. When I used it, animation was always slower than cursor movement. I switch my moving animation to distY and everything is ok.

Thanks for your job !

On

https://jsfiddle.net/twjou50r/1/embedded/result/

I have a webpage where scrolling does not work very well on mobile devices. I am using the emulation in chrome to try this. A phone will also prove the issue.

Problem: Nothing happends when I try to scroll, even if document content is taller than the window.

If I remove the lines

$('body').on('moveend', function ()
{
    /* something */
});

scrolling works as demonstrated on: https://jsfiddle.net/twjou50r/2/embedded/result/

(if you want to see the source of those jsfiddles, you click "Edit in JSFiddle")

Hi. There is an issue when using your move event plugin in a page with Mootools more loaded. The following steps can reproduce the issue:

1. Create an empty page with an element. Give position absolute to the element.
2. Add mootools and mootools more to your page.
3. Add jQuery and your move event plugin to the page.
4. Just bind the 'move' event to the element using jQuery. The element will become draggable!

Note that since you use the move plugin to the swipe plugin this issue also occurs in the swipe plugin.

In jQuery 1.8 node.data('events') doesn't return events bound to the element anymore, it does $._data(node, 'events') instead. Because of this change plugin throws exception during execution. This also affects jQuery.event.swipe

Your plugin is exactly what i was looking for, It miss only a thing it's to constrain the drag to the parent div.

And then it would be perfect for me.

Is there a way to get currentTarget to work correctly with delegated events or am I doing something wrong?

$(".itemPalette").on "movestart", ".item", (e) ->
  $(e.currentTarget) # is document rather than .item

Hey Stephen,

If I view the demo page (v 1.2) on a touch device (I tried with an iPad, a galaxy nexus and a nexus 7) I can move the red thing around, but cannot scroll the page around anymore.

I tried an older version (1.0.2) and the page scrolled normally.

cheers JL

on line 101 char 12 you use for ... of ... which is es6 or with moz extension. I am prepending your js to mine then doing minification. since i am using jshint, jslint or eslint before minification it fails. I can tell my preprocessor to use es6 on your file only but it would be nice if you include it too. just add to the head of your script...

/*jshint esversion: 6 */

Within the project is an old version of jQuery in js/jquery-3.1.1.js

Vulnerability checkers like retirejs indicate an issue with jquery.event.move, as it contains an outdated jQuery version with known vulnerabilities. As the readme of jquery.event.move notes jQuery is not required anymore, so removing (or updating) the jQuery would be appreciated.

Thank you!

When the element to scroll contains an input element the user cannot scroll the container if they touch over the input element. For example:

<div class="container" style="width: 500px; overflow: hidden;">
<p>Hello World</p>
<div style="width: 1100px">
<input type="text" id="firstName" style="width: 200px; display: inline-block;" />
<input type="text" id="firstName" style="width: 200px; display: inline-block;" />
<input type="text" id="firstName" style="width: 200px; display: inline-block;" />
<input type="text" id="firstName" style="width: 200px; display: inline-block;" />
<input type="text" id="firstName" style="width: 200px; display: inline-block;" />
</div>
</div>

In this case the user can scroll when they press over the paragraph but not when they press over the input.

For some reason after updating from 1.3.6 to 2.0.1, vertical scroll has stopped working in the Microsoft Edge 14 browser in Windows 10 Mobile devices.

Also, vertical scroll still works in the older Internet Explorer 11 mobile browser from an older Lumia, so this issue seems to affect Edge browsers only.

Whenever the plugin is updated, kindly consider not using ECMA Script 2015 methods (like the Symbol function) to prevent developers from ditching this plugin or reverting to version 1.3.6 (like in my case). Users don't always have the device or the browser we would like them to have, so my recommendation is to avoid rendering the plugin unusable for older browsers because there's hardly anything in ES 2015 that is mandatory for the implementation of gestures.

I used your lib to add swipe-to-close interaction to hamburger menu. The menu has inner scroll. Just so you know, I needed to comment out one line in your code to enable inner scroll on iPhone devices.

It might be better not to prevent scrolling by default, but allow us to manually choose wether specific direction should prevent the default event.

I was trying to use your other plugin "jquery.event.swipe.js" and find velocityX/Y return "NaN". Digging more, I come inside "jquery.event.move.js" and find when "updateEvent" is call, "timeStamp" is undefined and has side effect to false all calculation after about velocity. Digging again, I was trying to solve this adding "timeStamp" on "event" (inside "movestart" function) but browser throw a "TypeError: setting getter-only property "timeStamp" (which is not a surprise).

In desperation, I corrected by setting a new parameter to "updateEvent" : function updateEvent(event, touch, timeStamp, eTimeStamp) { and for the call : updateEvent(event, data.touch, data.timeStamp, e.timeStamp);

I'm sure this is not the best solution but at least it does the job ^^