-
Notifications
You must be signed in to change notification settings - Fork 44
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
56 additions
and
47 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -5,63 +5,72 @@ jQuery ReStable 0.1.2 | |
|
|
||
| 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.min.css"> | ||
| ```html | ||
| <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.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> | ||
|
|
||
| ```html | ||
| <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 action with: | ||
|
|
||
| $(window).ready(function () { | ||
| $.ReStable(); | ||
| }); | ||
| ```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: | ||
|
|
||
| $(window).ready(function () { | ||
| $('.mytable').ReStable(); | ||
| }); | ||
| ```js | ||
| $(document).ready(function () { | ||
| $('.mytable').ReStable(); | ||
| }); | ||
| ``` | ||
|
|
||
| If you need more control here's the plugin settings: | ||
|
|
||
| $('.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 | ||
| }); | ||
|
|
||
| ```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](http://codeb.it). You can contact me at [email protected] or [twitter](https://twitter.com/Micc1983) for any issue or feauture request. | ||
| ReStable 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 feature request. | ||