In {Theme} we used responsive tables from http://johnpolacek.github.io/stacktable.js/
Responsive Tables
HTML markup:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<table class="ct-js-table-stack"> <tr> <th class="ct-u-paddingBoth10 text-center">#</th> <th class="ct-u-paddingBoth10">Service</th> <th class="ct-u-paddingBoth10">Price range</th> <th class="ct-u-paddingBoth10">Description</th> </tr> <tr> <td class="text-center">1</td> <td>Skirts & Dresses</td> <td>from $14.00 to $45.00</td> <td>Shorten or lengthen, waist in or out, rehem, sides in or out, new zipper, add bra cups</td> </tr> <tr> <td class="text-center">2</td> <td>Jackets & Coats</td> <td>from 35.00 to $175.00</td> <td>Shorten or lengthen sleeves, sides in or out, new pockets, new lining</td> </tr> <tr> <td class="text-center">3</td> <td>Pants</td> <td>from $17.50 to $39.00</td> <td>Shorten or lengthen, cuffs,lined,waist/seat/crotch in or out </td> </tr> <tr> <td class="text-center">4</td> <td>Miscellaneous</td> <td>from $4.50 to $50.00</td> <td>Buttons, button holes, sew on patches/stripes on sleeves, new zipper/sliders/snaps</td> </tr> </table> |
CSS classes:
- .ct-js-table-stack
Javascripts:
|
1 2 3 4 5 6 7 |
(function ($) { "use strict"; $(document).ready(function () { $('.ct-js-table-stack').stacktable(); }) }(jQuery)); |