The "touchmove" event fails to be detected in Microsoft Edge browser

Is there a way to detect the touchmove event properly in Microsoft Edge when an element is dragged, similar to how it works in Chrome with clientx and clienty positions?

<div id="ele" style="position:absolute; top:0px; left:0px; width:100px;height:100px;border:1px solid"></div>

$(document).ready(function() {
   document.getElementById('ele').addEventListener('touchmove', function(e) 
   {
       console.log('event triggered');
   })
 });

In Edge, I am currently getting the mousemove event instead of touchmove. How can I ensure that touchmove is recognized in Microsoft Edge as well?

javascriptmicrosoft-edgemousemovetouchmove

Answer №1

Here is a suggestion for your HTML file:

Include the following line of code in your HTML document:
canvas { touch-action: none;}

Answer №2

If you're struggling with touch events, make sure to include "passive: false" in your code snippet below. The default setting is for passive to be true, so this small addition can make all the difference after spending days trying to figure it out!

document.addEventListener('touchmove', function(e) {
    e.preventDefault();
}, { passive: false });

UPDATE: While I believe another post has provided the correct solution, I'm keeping this here just in case. Some browsers may still require the passive: false declaration for the functionality you need.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How to retrieve the width of a document using jQuery?

Having a strange issue with determining the document width using $(document).width() during $(window).load and $(window).resize. The problem arises when the browser is initially full screen and then resized to a narrower width, causing content to require ...

javascriptjqueryhtmlcss

Retrieve the Most Recent Matching Date within an Array

In my mongoDB database, I am searching for datasets with expired date values. When I say expired, I mean that the timestamp of the last element in an array is older than a certain interval from the current timestamp (determined by a category). Each datase ...

javascriptmongodb

What is a method to omit elements within a nested child element from a selection without relying on the children() function

Here is an example of an element: <div id="foo"> <a href="#" class="some">click me</a> <div id="bar"> <a href="#" class="some">click me too</a> </div> </div> I am facing the challenge of selectin ...

javascriptjqueryselectorparent-child

Rails 6 not displaying Javascript as intended

I am a beginner at this, but so far everything seems to be functioning smoothly. On my page, users can upload and delete photos without any issues. The uploading and deleting processes work perfectly fine. However, I am facing an issue where the page does ...

javascriptjqueryajaxruby-on-rails-6

Challenges with the WebVR Boilerplate - Issues include the manager not displaying in VR mode, the camera being stuck looking straight down, and fullscreen mode only

I've been working on incorporating WebVR into a project that I created using Three.js, but I'm running into some issues with getting it to work properly. Several problems crop up when I try to view the scene: When VRMode is set to false, my ...

javascriptthree.jswebvr

Avoid duplicate items from being added to an array in AngularJS

I have created an Angular Single Page Application that includes a cart feature where users can add items. My goal is to prevent users from adding the same item to the cart more than once. function CartForm($scope) { $scope.products = [{ "descript ...

javascriptarraysangularjs

Creating scrollable Material tabs

In my application, I am utilizing Material tabs (using mat-tab elements inside a mat-tab-group). When there are too many tabs to be displayed at once, two navigation buttons appear to allow access to the other tabs: https://i.sstatic.net/i7Vhh.png I am l ...

javascriptangularangular-material

The request to check the API at http://localhost/v5/api/checker returned a 404 error, indicating that

Trying to create a function that uses AJAX to call PHP, but encountering an error when clicking the button. Does anyone know how to solve this issue? Code provided below. PHP: $app->get('/checker', function () { $jsonContents = file_get_ ...

javascriptphpajaxslim

Access to the Express Node.js server is restricted to the machine that is currently hosting the server

I am facing a beginner issue with using express. I am on Ubuntu 14.04 and created a new directory where I ran "express" in the terminal to set up a project template. Following that, I ran "npm install" to install the dependencies. I then made changes to &a ...

javascriptnode.jsexpress

Using jQuery to manipulate the image within a specific div element

I'm facing an issue with locating the img src within a div. I've written a function to find all the divs with specific ids: function identifyDiv(){ divArray = $("div[id^='your']"); divArray = _.shuffle(divArray); } This is the ...

javascriptjqueryhtmlcss

Is there a way for me to retrieve information from a different website using a URL, similar to how Digg's submit button works

Currently, I am in the process of developing a website with the cakePHP framework. As a beginner in PHP and web programming, my goal is to implement a feature similar to Digg's submit button. This functionality would involve inputting a URL, which the ...

phpjavascriptajaxcakephp

Verify a unique cross-field rule for comparing two time strings, customized by Vee

I am currently facing an issue with validating two time strings in my buefy form using vue. The goal is to ensure that the second time input does not exceed a one-hour difference from the first time input. Both time fields have granularity down to millisec ...

javascriptvue.jsvee-validate

Is it possible for the Mongodb find method to handle dynamic queries?

I am new to mongodb and would appreciate some advice on how to efficiently write the following query. In my collection, I have fields for location and date. There are 4 search conditions: Users can search without any parameters. Users can search with da ...

javascriptmongodb

Building a navigation system with previous and next buttons by implementing JavaScript

I am currently working with AngularJS and I have data that is being received in the form of an array containing two objects. As a newcomer, I am still trying to figure this out. data[ { "something":"something1", "something":"something1", "something":"some ...

javascriptarraysangularjsobject

Experience the power of Parasails.js combined with either Vue Router or virtualPages

I came across Parasails.js documentation which mentions support for router and virtualPages, but lacks specifics on how to utilize these options. I am familiar with the traditional Vue setup of importing Vue, VueRouter, and individual components directly ...

javascriptvue.jssails.jsvue-router

How can I fill the data array of arrays using an Angular Table component?

I am struggling to populate an Angular Table with data in the array of arrays format. Despite my efforts, the code I have written does not seem to work. Any suggestions for a solution would be greatly appreciated. Here is the data that I am trying to popu ...

javascriptangular

Toggle the visibility of a div depending on the user's selection

My HTML select element has a few options to choose from: <select class="form-control" data-val="true" data-val-number="The field CodeSetup must be a number." id="CodeSetup" name="CodeSetup"> <option selected="selected" value="0">AllCodes< ...

javascriptjqueryhtmlcss

Implement a new method called "defer" to an array that will be resolved at a later time using Promise.all()

I need to manage a queue of DB calls that will be executed only once the connection is established. The DB object is created and stored as a member of the module upon connection. DB Module: var db = { localDb: null, connectLocal: (dbName) => { ...

javascriptasynchronousvue.jspromisepouchdb

Access your Vue.js application using Google Sign-In (GIS)

Having trouble with the discontinuation of gapi.oauth2 by Google and finding the new Sign in With Google tools confusing. Project Structure Looking to implement user sign-in with Google on my Vue frontend and authenticate them using OIDC server flow on ...

javascriptvue.jsgoogle-signin

Sending template reference from one Angular component to another

I have a main grid component that includes smaller grid-item components. The majority of these grid items navigate to a specific route when clicked. However, there is one particular item that should open a modal window instead of navigating. Is there a wa ...

javascriptangulartypescript