Chrome "Emulate Touch Events" not working
I've enabled the "Emulate Touch Events" option in Chrome's Developer Tools. I set up a simple test program that alerts when I touch a <div>. The program works fine on my Galaxy Nexus, but when I click on the <div> in Chrome, even with the "Emulate Touch Events" option enabled, nothing happens. Any suggestions? Am I using this tool correctly?
Here's my code - nothing too fancy.
<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
#main_div
{
position: absolute;
width: 50px;
height: 20px;
background-color: red;
top: 50%;
left: 20px;
}
</style>
<script type="text/javascript">
function init()
{
main_div = document.getElementById("main_div");
main_div.ontouchstart = function()
{
alert("here");
}
}
</script>
</head>
<body onload="init()">
<div>
<p id="x">hello</p>
<p id="y"></p>
</div>
<div id="main_div">
hello
</div>
</body>
</html>
Answer
What stumped me was that in addition to having the "Emulate touch events" checkbox checked, you also have to have the master "Enable" checkbox checked to enable overrides. Once both were checked, it worked fine.
