jQuery Plugin For Mobile-friendly Responsive Table - RWD Tables
| File Size: | 14.7 KB |
|---|---|
| Views Total: | 2726 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
RWD Tables is a dead simple way that uses jQuery and CSS/CSS3 to make your html tables more readable on small screens like mobile devices. It will automatically transform a regular html table into a vertical single-column table based on a specified breakpoint set in CSS3 media queries.
How to use it:
1. Download and include jQuery library and the jQuery RWD Tables plugin on your web page.
<link rel="stylesheet" href="css/rwd-tables.css"> <script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <script src="js/jquery.rwd-tables.js"></script>
2. Call the plugin on your existing tables and done.
$( "table" ).rwdTables();
3. Change the breakpoints in the CSS.
@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {
...
}
This awesome jQuery plugin is developed by rossmc. For more Advanced Usages, please check the demo page or visit the official website.











