An open API service indexing awesome lists of open source software.

https://github.com/micc83/restable

🌈 jQuery plugin that makes tables responsive converting them to HTML lists on small viewports.
https://github.com/micc83/restable

jquery-plugin jquery-restable responsive table

Last synced: 12 months ago
JSON representation

🌈 jQuery plugin that makes tables responsive converting them to HTML lists on small viewports.

Awesome Lists containing this project

README

          

[![SWUbanner](https://raw.githubusercontent.com/vshymanskyy/StandWithUkraine/main/banner-direct.svg)](https://github.com/vshymanskyy/StandWithUkraine/blob/main/docs/README.md)

jQuery ReStable 0.1.2
========

**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.

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

```html

```

Let's say this is your table:

```html



Period
Full Board
Half Board
Bed and Breakfast




01/10/12 - 02/10/12
20 €
30 €
40 €


03/10/12 - 04/10/12
40 €
50 €
60 €


05/10/12 - 06/10/12
70 €
80 €
90 €

```
Now the only thing to do is to trigger the action with:

```js
$(document).ready(function () {
$.ReStable();
});
```

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

```js
$(document).ready(function () {
$('.mytable').ReStable();
});
```

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

```js
$('.mytable').ReStable({
rowHeaders: true, // Table has row headers?
maxWidth: 480, // Size to which the table become responsive
keepHtml: false // Keep the html content of cells
});
```

## Credits and contacts

ReStable has been made by [me](https://github.com/micc83). You can contact me at micc83@gmail.com or [twitter](https://twitter.com/Micc1983) for any issue or feature request.