با استفاده از این پلاگین می توانید جدولی داشته باشید که در هر رزلیشنی تغیر کند .
آموزش استفاده
۱- فراخوانی کتابخانه پلاگین و خصوصیت ها
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script> <script src="jquery-1.10.2.min.js" type="text/javascript"></script> <script type="text/javascript" src="jquery-responsiveTables.js"></script> <script type="text/javascript" src="jquery.responsiveText.js"></script> <script type="text/javascript"> $(document).ready(function() { $('.responsive').not('table').responsiveText(); $('table.responsive').responsiveTables(); }); </script> <link href='http://fonts.googleapis.com/css?family=Pacifico|Average+Sans' rel='stylesheet' type='text/css'> <link rel="stylesheet" type="text/css" href="jquery-responsiveTables.css" />
2- کد html جهت استفاده پلاگین
<table class="responsive" data-min="11" data-max="30" cellpadding="0" cellspacing="0"> <thead> <tr> <th valign="middle">Opera</th> <th valign="middle">Internet Explorer</th> <th valign="middle">Firefox</th> <th valign="middle">Chrome</th> <th valign="middle">Safari</th> <th valign="middle">1392</th> </tr> </thead> <tbody> <tr> <th valign="middle">1.6 %</th> <td valign="middle">12.6 %</td> <td valign="middle">27.7 %</td> <td valign="middle">52.9 %</td> <td valign="middle">4.0 %</td> <td valign="middle">فروردین</td> </tr> <tr> <th valign="middle">1.7 %</th> <td valign="middle">12.7 %</td> <td valign="middle">27.9 %</td> <td valign="middle">52.7 %</td> <td valign="middle">4.0 %</td> <td valign="middle">اردیبهشت</td> </tr> <tr> <th valign="middle">1.8 %</th> <td valign="middle">13.0 %</td> <td valign="middle">28.5 %</td> <td valign="middle">51.7 %</td> <td valign="middle">4.1 %</td> <td valign="middle">خرداد</td> </tr> <tr> <th valign="middle">1.8 %</th> <td valign="middle">13.5 %</td> <td valign="middle">29.6 %</td> <td valign="middle">50.0 %</td> <td valign="middle">4.1 %</td> <td valign="middle">تیر</td> </tr> <tr> <th valign="middle">1.9 %</th> <td valign="middle">14.3 %</td> <td valign="middle">30.2 %</td> <td valign="middle">48.4 %</td> <td valign="middle">4.2 %</td> <td valign="middle">مرداد</td> </tr> </tbody> </table>