Geek Answers Handbook

Touch event not called

Can someone tell me why the touchhenter event is not working in this code. The mouse works fine on the desktop. It should be so simple, I'm missing something.

An example here is http://jsfiddle.net/gCEqH/6/

Full code below:

<!DOCTYPE html> <html> <head> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> </head> <body> <img id="myImg" src="http://jackiehutchings.com/wp-content/uploads/2011/09/g-plus-icon-96x96.png" /> <script> $(window).load(function() { $('#myImg').on("touchenter mouseenter", function(event){ alert('entered!'); }); }); </script> </body> </html>
+6
source share
1 answer

Maybe something like this will work?

 var elementIdTouching = ""; $('body').on("touchmove", function(e){ var tList = e.touches; // get list of all touches for (var i = 0; i < tList.length; i++) { var thisTouch = tList[i]; // not 100% sure about this var elementTouching = document.elementFromPoint( thisTouch.screenX, thisTouch.screenY ); if (elementTouching.id != elementIdTouching) { elementIdTouching = elementTouching.id; if (elementTouching.id == "myImg") { alert("entered!"); } } } }).on("touchend", function(e){ elementIdTouching = ""; }); $('#myImg').on("mouseenter", function(e){ alert('entered!'); });

tList ~ https://developer.mozilla.org/en-US/docs/Web/API/TouchList

Disclaimer: I have not tested this.

0
source

More articles:


All Articles