Friday, 11 January 2013

How To Create A Focussable Image Button?

Surprizingly, it has not been that easy to create a focussable image button. There is a lot of incongruent information available out there. Hence, this post. The solution is quite simple when you know it:
<html>
<head></head>
  <body>
    <script>
      function doSomething() {
        alert('Hello!'); 
      }
    </script>
    <input type="image" tabindex="0" onclick="doSomething()"
      src="http://upload.wikimedia.org/wikipedia/commons/thumb/0/0c/White_and_yellow_flower.JPG/320px-White_and_yellow_flower.JPG" 
    />
    </body>
</html>
The JSFiddle is available here.