How to set image to be tabbable

Question

I have an image and I want the user to be able to naviagte to it using the tab button. I am unable to set the tab-index due to the way the page is changed dynamically. How can I set the image to be tabbable?

Answer 1

Try wrapping them inside anchors <a tabindex="1"><img src="..." /></a> and set tabindex attribute to dynamically created elements $("<a>").attr("tabindex",tabindex):

var anchor = $("<a>").attr("href",image_link).attr("tabindex", tabindex);
var img = $("<img>").attr("src", image_src).appendTo(anchor);

See this example http://jsfiddle.net/EsEeN/