Cookies setting

Touch The Web: Touch from scratch

When dealing with JavaScript (particularly jQuery), many of the plugins and libraries do not work as you would’ve expected. Same goes for many everyday problems too. The last resort of the poor man, that can't afford someone else to do things for him, is to do it himself from scratch. As Jesus once said “Do it yourself and god will help you”. This is not the quickest of options and definitely not the easiest, but sometimes it is the only way to make something work the way you want it to. That was the case of moving multiple object simultaneously with touch. Turns out the solution for this particular problem is actually very easy. This purpose of this chapter is mainly to give some positive motivation by point you in the the right direction, if you resort to work from scratch on a HTML5 touch project.

First thing here are some links on the fundamentals of touch with HTM 5 from scratch: Mozilla developer network, Safari developer library, Html5rocks Multi-touch Web Development. This more than covers all the basics, but as usual a simple web search will out put tons of more material.

Here is the example. Be advised that this It’s touch only, no mouse drag is implemented. Mainly for an easier overview of the actual code and because with a mouse you can move only one object at a time. The code is pretty simple, a lot similar logic to the one used in the previous chapter on hammer.js. The difference here is that when the function is called on multiple objects those can just be moved with multiple fingers on the screen at the same time (yes it is that simple). The most important thing is to use document.getElementById(element) to get the object you want to move, using the jQuery $(‘#element) wont work. The rest is documented in the code itself.

I haven’t yet figured out a good way to achieve the same with hammer.js, mainly because I don't really need it for the project I’m working on. I someone figures it out please link it in the comments section so it can help me and others learning. Stubborn as I am, I would not rule out completely, me working on it in the future. And on this bomb shell I think is time to end this series.

09 Jun 2013 at 13:23