Arrow key navigation for html table
TableNav is intractive jquery plugin for html table.

 

Download View Source

Suppoerted Browser
IE
- 9+
Firefox
- 52+
Chrome
- 57+
Safari
- 9.1+
Opera
- 44+

Installation

TableNav is a the jQuery plugin, used you need jquery before install it,then

<script src="path/to/jquery.tablenav.js"></script>
<script>

$(function() {
$("table").tabnav();
});

</script>

Examples

You lots of awesome thing using table, here some examples



<script>

$(function() {
$("table").tabnav({
	input:true,
	background:'transparent'
});
});

</script>

<script>

$(function() {
$("table").tabnav({
	background:'#89AAE6',
	input:true
});
});

</script>
<script>
$(function() {
$("table").tabnav();
});

</script>
<script>
$(function() {
$("table").tabnav({
	input:true,
	background:'steelblue'
});
});

</script>
<style>
.grid-table-clicked input{
background: transparent;
outline: none;
border: none;

}
</style>

Global Options

Property Default Value
Input False
Click true
Background #e7fac6
z-index 12
Class grid-table-clicked