Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
micc83 committed Nov 20, 2013
1 parent 7872e7e commit 259f0e9
Showing 1 changed file with 58 additions and 2 deletions.
60 changes: 58 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,66 @@
jQuery ReStable
========

**jQuery ReStable** is a very simple and lightweight (~1Kb) jQuery plugin that make tables responsive making them collapse into ul lists.
**jQuery ReStable** is a very simple and lightweight (~1Kb) jQuery plugin that make tables responsive making them collapse into ul lists.You can find some examples in the included demo or [here](http://codeb.it/restable/).

To use it you just have to include jQuery and a copy of the plugin in your head or footer:

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="jquery.restable.min.js"></script>
<link rel="stylesheet" href="jquery.restable.css">
<link rel="stylesheet" href="jquery.restable.min.css">

Let's say this is your table:

<table class="mytable">
<thead>
<tr>
<td>Period</td>
<td>Full Board</td>
<td>Half Board</td>
<td>Bed and Breakfast</td>
</tr>
</thead>
<tbody>
<tr>
<td>01/10/12 - 02/10/12</td>
<td>20 €</td>
<td>30 €</td>
<td>40 €</td>
</tr>
<tr>
<td>03/10/12 - 04/10/12</td>
<td>40 €</td>
<td>50 €</td>
<td>60 €</td>
</tr>
<tr>
<td>05/10/12 - 06/10/12</td>
<td>70 €</td>
<td>80 €</td>
<td>90 €</td>
</tr>
</tbody>
</table>

Now the only thing to do is to trigger the menu with:

$(window).ready(function () {
$.ReStable();
});

This will target automatically all the tables in the page but you can, off course, target one or more elements with:

$(window).ready(function () {
$('.mytable').ReStable();
});

If you need more control here's the plugin settings:

$('.toresponsive').ReSmenu({
rowHeaders: true, // Table has row headers?
maxWidth: 480 // Size to which the table become responsive
});

## Credits and contacts

ReSmenu has been made by [me](http://codeb.it). You can contact me at [email protected] or [twitter](https://twitter.com/Micc1983) for any issue or feauture request.

0 comments on commit 259f0e9

Please sign in to comment.