Pastebin launched a little side project called VERYVIRAL.com, check it out ;-) Want more features on Pastebin? Sign Up, it's FREE!
Guest

Untitled

By: a guest on Feb 19th, 2013  |  syntax: HTML  |  size: 11.90 KB  |  views: 14  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. --- html code
  2.  
  3.  
  4. <div class="clearfix sepH_b">
  5.   <div class="btn-group col_vis_menu">
  6.     <a href="#" data-toggle="dropdown" class="btn btn-inverse dropdown-toggle">Columns <span class="caret"></span></a>
  7.     <ul class="dropdown-menu tableMenu" id="dt_tools_vis_nav">
  8.       <li><label class="checkbox" for="dt_col_1"><input type="checkbox" value="0" id="dt_col_1" name="toggle-cols" checked="checked" /> Rendering engine</label></li>
  9.       <li><label class="checkbox" for="dt_col_2"><input type="checkbox" value="1" id="dt_col_2" name="toggle-cols" checked="checked" /> Browser</label></li>
  10.       <li><label class="checkbox" for="dt_col_3"><input type="checkbox" value="2" id="dt_col_3" name="toggle-cols" checked="checked" /> Platform(s)</label></li>
  11.       <li><label class="checkbox" for="dt_col_4"><input type="checkbox" value="3" id="dt_col_4" name="toggle-cols" checked="checked" /> Engine version</label></li>
  12.       <li><label class="checkbox" for="dt_col_5"><input type="checkbox" value="4" id="dt_col_5" name="toggle-cols" checked="checked" /> CSS grade</label></li>
  13.     </ul>
  14.   </div>
  15. </div>
  16. <table class="table table-striped table-bordered" id="dt_tools_vis">
  17.   <thead>
  18.     <tr>
  19.       <th>Rendering engine</th>
  20.       <th>Browser</th>
  21.       <th>Platform(s)</th>
  22.       <th>Engine version</th>
  23.       <th>CSS grade</th>
  24.     </tr>
  25.   </thead>
  26.   <tbody>
  27.     <tr>
  28.       <td>Trident</td>
  29.       <td>Internet
  30.         Explorer 4.0
  31.       </td>
  32.       <td>Win 95+</td>
  33.       <td class="center"> 4</td>
  34.       <td class="center">X</td>
  35.     </tr>
  36.     <tr>
  37.       <td>Trident</td>
  38.       <td>Internet
  39.         Explorer 5.0
  40.       </td>
  41.       <td>Win 95+</td>
  42.       <td class="center">5</td>
  43.       <td class="center">C</td>
  44.     </tr>
  45.     <tr>
  46.       <td>Trident</td>
  47.       <td>Internet
  48.         Explorer 5.5
  49.       </td>
  50.       <td>Win 95+</td>
  51.       <td class="center">5.5</td>
  52.       <td class="center">A</td>
  53.     </tr>
  54.     <tr>
  55.       <td>Trident</td>
  56.       <td>Internet
  57.         Explorer 6
  58.       </td>
  59.       <td>Win 98+</td>
  60.       <td class="center">6</td>
  61.       <td class="center">A</td>
  62.     </tr>
  63.     <tr>
  64.       <td>Trident</td>
  65.       <td>Internet Explorer 7</td>
  66.       <td>Win XP SP2+</td>
  67.       <td class="center">7</td>
  68.       <td class="center">A</td>
  69.     </tr>
  70.     <tr>
  71.       <td>Trident</td>
  72.       <td>AOL browser (AOL desktop)</td>
  73.       <td>Win XP</td>
  74.       <td class="center">6</td>
  75.       <td class="center">A</td>
  76.     </tr>
  77.     <tr>
  78.       <td>Gecko</td>
  79.       <td>Firefox 1.0</td>
  80.       <td>Win 98+ / OSX.2+</td>
  81.       <td class="center">1.7</td>
  82.       <td class="center">A</td>
  83.     </tr>
  84.     <tr>
  85.       <td>Gecko</td>
  86.       <td>Firefox 1.5</td>
  87.       <td>Win 98+ / OSX.2+</td>
  88.       <td class="center">1.8</td>
  89.       <td class="center">A</td>
  90.     </tr>
  91.     <tr>
  92.       <td>Gecko</td>
  93.       <td>Firefox 2.0</td>
  94.       <td>Win 98+ / OSX.2+</td>
  95.       <td class="center">1.8</td>
  96.       <td class="center">A</td>
  97.     </tr>
  98.     <tr>
  99.       <td>Gecko</td>
  100.       <td>Firefox 3.0</td>
  101.       <td>Win 2k+ / OSX.3+</td>
  102.       <td class="center">1.9</td>
  103.       <td class="center">A</td>
  104.     </tr>
  105.     <tr>
  106.       <td>Gecko</td>
  107.       <td>Camino 1.0</td>
  108.       <td>OSX.2+</td>
  109.       <td class="center">1.8</td>
  110.       <td class="center">A</td>
  111.     </tr>
  112.     <tr>
  113.       <td>Gecko</td>
  114.       <td>Camino 1.5</td>
  115.       <td>OSX.3+</td>
  116.       <td class="center">1.8</td>
  117.       <td class="center">A</td>
  118.     </tr>
  119.     <tr>
  120.       <td>Gecko</td>
  121.       <td>Netscape 7.2</td>
  122.       <td>Win 95+ / Mac OS 8.6-9.2</td>
  123.       <td class="center">1.7</td>
  124.       <td class="center">A</td>
  125.     </tr>
  126.     <tr>
  127.       <td>Gecko</td>
  128.       <td>Netscape Browser 8</td>
  129.       <td>Win 98SE+</td>
  130.       <td class="center">1.7</td>
  131.       <td class="center">A</td>
  132.     </tr>
  133.     <tr>
  134.       <td>Gecko</td>
  135.       <td>Netscape Navigator 9</td>
  136.       <td>Win 98+ / OSX.2+</td>
  137.       <td class="center">1.8</td>
  138.       <td class="center">A</td>
  139.     </tr>
  140.     <tr>
  141.       <td>Gecko</td>
  142.       <td>Mozilla 1.0</td>
  143.       <td>Win 95+ / OSX.1+</td>
  144.       <td class="center">1</td>
  145.       <td class="center">A</td>
  146.     </tr>
  147.     <tr>
  148.       <td>Gecko</td>
  149.       <td>Mozilla 1.1</td>
  150.       <td>Win 95+ / OSX.1+</td>
  151.       <td class="center">1.1</td>
  152.       <td class="center">A</td>
  153.     </tr>
  154.     <tr>
  155.       <td>Gecko</td>
  156.       <td>Mozilla 1.2</td>
  157.       <td>Win 95+ / OSX.1+</td>
  158.       <td class="center">1.2</td>
  159.       <td class="center">A</td>
  160.     </tr>
  161.     <tr>
  162.       <td>Gecko</td>
  163.       <td>Mozilla 1.3</td>
  164.       <td>Win 95+ / OSX.1+</td>
  165.       <td class="center">1.3</td>
  166.       <td class="center">A</td>
  167.     </tr>
  168.     <tr>
  169.       <td>Gecko</td>
  170.       <td>Mozilla 1.4</td>
  171.       <td>Win 95+ / OSX.1+</td>
  172.       <td class="center">1.4</td>
  173.       <td class="center">A</td>
  174.     </tr>
  175.     <tr>
  176.       <td>Gecko</td>
  177.       <td>Mozilla 1.5</td>
  178.       <td>Win 95+ / OSX.1+</td>
  179.       <td class="center">1.5</td>
  180.       <td class="center">A</td>
  181.     </tr>
  182.     <tr>
  183.       <td>Gecko</td>
  184.       <td>Mozilla 1.6</td>
  185.       <td>Win 95+ / OSX.1+</td>
  186.       <td class="center">1.6</td>
  187.       <td class="center">A</td>
  188.     </tr>
  189.     <tr>
  190.       <td>Gecko</td>
  191.       <td>Mozilla 1.7</td>
  192.       <td>Win 98+ / OSX.1+</td>
  193.       <td class="center">1.7</td>
  194.       <td class="center">A</td>
  195.     </tr>
  196.     <tr>
  197.       <td>Gecko</td>
  198.       <td>Mozilla 1.8</td>
  199.       <td>Win 98+ / OSX.1+</td>
  200.       <td class="center">1.8</td>
  201.       <td class="center">A</td>
  202.     </tr>
  203.     <tr>
  204.       <td>Gecko</td>
  205.       <td>Seamonkey 1.1</td>
  206.       <td>Win 98+ / OSX.2+</td>
  207.       <td class="center">1.8</td>
  208.       <td class="center">A</td>
  209.     </tr>
  210.     <tr>
  211.       <td>Gecko</td>
  212.       <td>Epiphany 2.20</td>
  213.       <td>Gnome</td>
  214.       <td class="center">1.8</td>
  215.       <td class="center">A</td>
  216.     </tr>
  217.     <tr>
  218.       <td>Webkit</td>
  219.       <td>Safari 1.2</td>
  220.       <td>OSX.3</td>
  221.       <td class="center">125.5</td>
  222.       <td class="center">A</td>
  223.     </tr>
  224.     <tr>
  225.       <td>Webkit</td>
  226.       <td>Safari 1.3</td>
  227.       <td>OSX.3</td>
  228.       <td class="center">312.8</td>
  229.       <td class="center">A</td>
  230.     </tr>
  231.     <tr>
  232.       <td>Webkit</td>
  233.       <td>Safari 2.0</td>
  234.       <td>OSX.4+</td>
  235.       <td class="center">419.3</td>
  236.       <td class="center">A</td>
  237.     </tr>
  238.     <tr>
  239.       <td>Webkit</td>
  240.       <td>Safari 3.0</td>
  241.       <td>OSX.4+</td>
  242.       <td class="center">522.1</td>
  243.       <td class="center">A</td>
  244.     </tr>
  245.     <tr>
  246.       <td>Webkit</td>
  247.       <td>OmniWeb 5.5</td>
  248.       <td>OSX.4+</td>
  249.       <td class="center">420</td>
  250.       <td class="center">A</td>
  251.     </tr>
  252.     <tr>
  253.       <td>Webkit</td>
  254.       <td>iPod Touch / iPhone</td>
  255.       <td>iPod</td>
  256.       <td class="center">420.1</td>
  257.       <td class="center">A</td>
  258.     </tr>
  259.     <tr>
  260.       <td>Webkit</td>
  261.       <td>S60</td>
  262.       <td>S60</td>
  263.       <td class="center">413</td>
  264.       <td class="center">A</td>
  265.     </tr>
  266.     <tr>
  267.       <td>Presto</td>
  268.       <td>Opera 7.0</td>
  269.       <td>Win 95+ / OSX.1+</td>
  270.       <td class="center">-</td>
  271.       <td class="center">A</td>
  272.     </tr>
  273.     <tr>
  274.       <td>Presto</td>
  275.       <td>Opera 7.5</td>
  276.       <td>Win 95+ / OSX.2+</td>
  277.       <td class="center">-</td>
  278.       <td class="center">A</td>
  279.     </tr>
  280.     <tr>
  281.       <td>Presto</td>
  282.       <td>Opera 8.0</td>
  283.       <td>Win 95+ / OSX.2+</td>
  284.       <td class="center">-</td>
  285.       <td class="center">A</td>
  286.     </tr>
  287.     <tr>
  288.       <td>Presto</td>
  289.       <td>Opera 8.5</td>
  290.       <td>Win 95+ / OSX.2+</td>
  291.       <td class="center">-</td>
  292.       <td class="center">A</td>
  293.     </tr>
  294.     <tr>
  295.       <td>Presto</td>
  296.       <td>Opera 9.0</td>
  297.       <td>Win 95+ / OSX.3+</td>
  298.       <td class="center">-</td>
  299.       <td class="center">A</td>
  300.     </tr>
  301.     <tr>
  302.       <td>Presto</td>
  303.       <td>Opera 9.2</td>
  304.       <td>Win 88+ / OSX.3+</td>
  305.       <td class="center">-</td>
  306.       <td class="center">A</td>
  307.     </tr>
  308.     <tr>
  309.       <td>Presto</td>
  310.       <td>Opera 9.5</td>
  311.       <td>Win 88+ / OSX.3+</td>
  312.       <td class="center">-</td>
  313.       <td class="center">A</td>
  314.     </tr>
  315.     <tr>
  316.       <td>Presto</td>
  317.       <td>Opera for Wii</td>
  318.       <td>Wii</td>
  319.       <td class="center">-</td>
  320.       <td class="center">A</td>
  321.     </tr>
  322.     <tr>
  323.       <td>Presto</td>
  324.       <td>Nokia N800</td>
  325.       <td>N800</td>
  326.       <td class="center">-</td>
  327.       <td class="center">A</td>
  328.     </tr>
  329.     <tr>
  330.       <td>Presto</td>
  331.       <td>Nintendo DS browser</td>
  332.       <td>Nintendo DS</td>
  333.       <td class="center">8.5</td>
  334.       <td class="center">C/A<sup>1</sup></td>
  335.     </tr>
  336.     <tr>
  337.       <td>KHTML</td>
  338.       <td>Konqureror 3.1</td>
  339.       <td>KDE 3.1</td>
  340.       <td class="center">3.1</td>
  341.       <td class="center">C</td>
  342.     </tr>
  343.     <tr>
  344.       <td>KHTML</td>
  345.       <td>Konqureror 3.3</td>
  346.       <td>KDE 3.3</td>
  347.       <td class="center">3.3</td>
  348.       <td class="center">A</td>
  349.     </tr>
  350.     <tr>
  351.       <td>KHTML</td>
  352.       <td>Konqureror 3.5</td>
  353.       <td>KDE 3.5</td>
  354.       <td class="center">3.5</td>
  355.       <td class="center">A</td>
  356.     </tr>
  357.     <tr>
  358.       <td>Tasman</td>
  359.       <td>Internet Explorer 4.5</td>
  360.       <td>Mac OS 8-9</td>
  361.       <td class="center">-</td>
  362.       <td class="center">X</td>
  363.     </tr>
  364.     <tr>
  365.       <td>Tasman</td>
  366.       <td>Internet Explorer 5.1</td>
  367.       <td>Mac OS 7.6-9</td>
  368.       <td class="center">1</td>
  369.       <td class="center">C</td>
  370.     </tr>
  371.     <tr>
  372.       <td>Tasman</td>
  373.       <td>Internet Explorer 5.2</td>
  374.       <td>Mac OS 8-X</td>
  375.       <td class="center">1</td>
  376.       <td class="center">C</td>
  377.     </tr>
  378.     <tr>
  379.       <td>Misc</td>
  380.       <td>NetFront 3.1</td>
  381.       <td>Embedded devices</td>
  382.       <td class="center">-</td>
  383.       <td class="center">C</td>
  384.     </tr>
  385.     <tr>
  386.       <td>Misc</td>
  387.       <td>NetFront 3.4</td>
  388.       <td>Embedded devices</td>
  389.       <td class="center">-</td>
  390.       <td class="center">A</td>
  391.     </tr>
  392.     <tr>
  393.       <td>Misc</td>
  394.       <td>Dillo 0.8</td>
  395.       <td>Embedded devices</td>
  396.       <td class="center">-</td>
  397.       <td class="center">X</td>
  398.     </tr>
  399.     <tr>
  400.       <td>Misc</td>
  401.       <td>Links</td>
  402.       <td>Text only</td>
  403.       <td class="center">-</td>
  404.       <td class="center">X</td>
  405.     </tr>
  406.     <tr>
  407.       <td>Misc</td>
  408.       <td>Lynx</td>
  409.       <td>Text only</td>
  410.       <td class="center">-</td>
  411.       <td class="center">X</td>
  412.     </tr>
  413.     <tr>
  414.       <td>Misc</td>
  415.       <td>IE Mobile</td>
  416.       <td>Windows Mobile 6</td>
  417.       <td class="center">-</td>
  418.       <td class="center">C</td>
  419.     </tr>
  420.     <tr>
  421.       <td>Misc</td>
  422.       <td>PSP browser</td>
  423.       <td>PSP</td>
  424.       <td class="center">-</td>
  425.       <td class="center">C</td>
  426.     </tr>
  427.     <tr class="gradeU">
  428.       <td>Other browsers</td>
  429.       <td>All others</td>
  430.       <td>-</td>
  431.       <td class="center">-</td>
  432.       <td class="center">U</td>
  433.     </tr>
  434.   </tbody>
  435. </table>
  436.  
  437. --- js code
  438.  
  439. if ($('#dt_tools_vis').length) {
  440.  
  441.   function fnShowHide(iCol) {
  442.     var oTable = $('#dt_tools_vis').dataTable();
  443.     var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
  444.     oTable.fnSetColumnVis(iCol, bVis ? false : true);
  445.   };
  446.  
  447.   var oTable = $('#dt_tools_vis').dataTable({
  448.     "sPaginationType": "bootstrap",
  449.     "sDom": "<'row'<'span4'l><'span4'T><'span4'f>r>t<'row'<'span6'i><'span6'p>>",
  450.     "oTableTools": {
  451.       "aButtons": [
  452.         "copy",
  453.         "print", {
  454.         "sExtends": "collection",
  455.         "sButtonText": 'Save <span class="caret" />',
  456.         "aButtons": [{
  457.           "sExtends": "csv",
  458.           "mColumns": "visible"
  459.         }, {
  460.           "sExtends": "xls",
  461.           "mColumns": "visible"
  462.         }, {
  463.           "sExtends": "pdf",
  464.           "mColumns": "visible"
  465.         }]
  466.       }],
  467.       "sSwfPath": "lib/datatables/extras/TableTools/media/swf/copy_csv_xls_pdf.swf"
  468.     }
  469.   });
  470.  
  471.   $('#dt_tools_vis_nav').on('click', 'li input', function () {
  472.     fnShowHide($(this).val());
  473.   });
  474. }