Preview: ngResponsiveTables - Resize the screen to see how it works

Warning: This jquery plugin requires CSS3 in order to work properly!*

ngResponsiveTables

This jQuery plugin converts regular table view into user friendly table for mobile devices.

Usage

Default options:

$(function(){
  $('.ng-table').ngResponsiveTables({
    smallPaddingCharNo: 13,
    mediumPaddingCharNo: 18,
    largePaddingCharNo: 30
  });
});

Options

• smallPaddingCharNo - Set the max number of characters inside the current table cell, and add the 'small-padding' class on the current td (if the length of the characters is smaller than this number)
• mediumPaddingCharNo - Set the max number of characters inside the current table cell, and add the 'medium-padding' class on the current td (if the length of the characters is smaller than this number)
• largePaddingCharNo - Set the max number of characters inside the current table cell, and add the 'large-padding' class on the current td (if the length of the characters is smaller than this number)

WARNING

All paddings must be declared in ng_responsive_tables.css CSS file!

Idea

Idea for this project came from CSS Tricks

Author

Tomislav Matijević