I made a simple game with Easeljs. Basically it's a clicking game, where user has to continuously click a button at a fast speed.
It works perfectly on Android and any PC browser. However, when I test it on iPhone I find that when user clicks fast, the onclick event is never fired. When user clicks slowly it works fine.
I suspect that it has something to do with safari's double tap gesture. I tried fastclick, it didn't help.
Here's the Html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,user-scalable=no">
<script src="createjs-2015.05.21.min.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body onload="init();">
<div class="main">
<canvas id="testCanvas" height="1000" width="1000"></canvas>
</div>
<script src="app.js"></script>
</body>
</html>
And here's how I add the button:
var button = new createjs.Bitmap(loader.getResult("button"));
var hitArea = new createjs.Shape;
hitArea.graphics.beginFill("#000").drawRect(0, 0, 500, 500);
button.hitArea = hitArea;
button.addEventListener("click", buttonOnClick);
stage.addChild(button);
function buttonOnClick(event) {...}
Thanks in advance!
I added
createjs.Touch.enable(stage);
and fixed it.