HTML and CSS Reference
In-Depth Information
Enable the touch event
In EaselJS, we use
cjs.Touch.enable
to enable the touch event. The first argument is
related to the game stage. The second argument deines a single touch or muliple touches.
The third argument determines whether the default browser's touch event is preserved or
not. If the default behavior is disabled, the user cannot scroll down the page by dragging
on the game stage.
There is a delay of 300 ms on a click event in a mobile device. This delay is good for normal
web browsing as the reader will not accidently missclick on the links that may be present
on the web page. However, in the game, we need to get rid of the delay to make the UI feel
responsive to the player's acion.
We can eliminate the delay by using the
touchstart
and
touchend
event. We can change
the click event to a touch event ourselves, or we can use the
fastclick
library. Using the
library is easier because it automaically detects the original click event and changes that
may appear while using the touch event without any modiicaion to the code.
An iOS mobile web app
When the
apple-mobile-web-app-capable
meta tag is used, iOS treats the web page
as a web app. A web app would show up as a naive app in the muli-task switching screen.
The following screenshot shows how our web app sits besides the naive
Seings
app:
