Using the keyboard arrow keys

Today’s post is a rather short and simple one. In most client-based games today, you can move using your keyboard. Browser-based games, however, are usually controlled using the mouse. But though using the arrow or WASD keys to interact with web pages is not too common, it can still be quite useful.

In a web page, any key you press triggers an event, so using the keyboard to control a browser-based game is as simple as listening for and catching these events. Listening for keyboard events is fairly easy if you’re using JavaScript, and with jQuery it’s even easier. Before we get properly started, I’d like to introduce a very simple and useful jQuery plugin called HotKeys, which can help you attach to events in a simple manner. You can find it here, and binding with it is a simple matter of:

$(document).bind('keydown', 'Ctrl+c', fn);

Sometimes, however, you want to do things yourself and not use a plugin. Continue reading

Welcome to Webdev Playground

First, let me start by explaining the purpose of this blog. I usually think that the best time to explain why something is starting is at the beginning… so here goes.

There are a lot of sites, blogs, and portalsĀ  around that teach and explain how to do this or that in web development, so you may be asking, why do we need another one? Simple – We can never have enough. No, really. I started learning web development about 10 years ago, and ever since then I find myself constantly in search of more sites, and many of the sites I’ve found have managed to teach me something new, so I really do think we can’t have enough, especially this day and age.

There’s another reason for my starting this blog. As I mentioned, quite a large chunk of the things I know, I’ve learned from other people’s blogs and sites, so I think it’s about time I started giving back to the community.

Having said that, you are now probably wondering what is going to make this particular site so special, so let’s answer that next. In this site I’m going to focus less on web design (much less actually), and more on the logic of web development. The main focus is going to be building browser based games, built with JavaScript, (x)HTML & CSS (once in a while a bit of server-side scripting will be involved).

I plan to update about once a week with new projects/parts. This week we will start with a simple game of tic-tac-toe. You probably know this one and it will be easy and fun to write, so stay tuned.

Until next time,

Adi Gabai