| 
0
 | 
     1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 | 
| 
 | 
     2 <html>
 | 
| 
 | 
     3 	<head>
 | 
| 
 | 
     4 		<meta http-equiv="content-type" content="text/html; charset=utf-8">
 | 
| 
 | 
     5 		<link rel="shortcut icon" type="image/ico" href="http://www.sprymedia.co.uk/media/images/favicon.ico">
 | 
| 
 | 
     6 		
 | 
| 
 | 
     7 		<title>TableTools example</title>
 | 
| 
 | 
     8 		<style type="text/css" title="currentStyle">
 | 
| 
 | 
     9 			@import "../../media/css/demo_page.css";
 | 
| 
 | 
    10 			@import "../../media/css/demo_table.css";
 | 
| 
 | 
    11 			@import "media/css/TableTools.css";
 | 
| 
 | 
    12 		</style>
 | 
| 
 | 
    13 		<script type="text/javascript" charset="utf-8" src="../../media/js/jquery.js"></script>
 | 
| 
 | 
    14 		<script type="text/javascript" charset="utf-8" src="../../media/js/jquery.dataTables.js"></script>
 | 
| 
 | 
    15 		<script type="text/javascript" charset="utf-8" src="media/js/ZeroClipboard.js"></script>
 | 
| 
 | 
    16 		<script type="text/javascript" charset="utf-8" src="media/js/TableTools.js"></script>
 | 
| 
 | 
    17 		<script type="text/javascript" charset="utf-8">
 | 
| 
 | 
    18 			$(document).ready( function () {
 | 
| 
 | 
    19 				$('#example').dataTable( {
 | 
| 
 | 
    20 					"sDom": 'T<"clear">lfrtip',
 | 
| 
 | 
    21 					"oTableTools": {
 | 
| 
 | 
    22 						"aButtons": [ "copy", "print" ]
 | 
| 
 | 
    23 					}
 | 
| 
 | 
    24 				} );
 | 
| 
 | 
    25 			} );
 | 
| 
 | 
    26 		</script>
 | 
| 
 | 
    27 	</head>
 | 
| 
 | 
    28 	<body id="dt_example">
 | 
| 
 | 
    29 		<div id="container">
 | 
| 
 | 
    30 			<div class="full_width big">
 | 
| 
 | 
    31 				TableTools example - button arrangement
 | 
| 
 | 
    32 			</div>
 | 
| 
 | 
    33 			
 | 
| 
 | 
    34 			<h1>Preamble</h1>
 | 
| 
 | 
    35 			<p>TableTools makes it very simple to arrange the buttons in the toolbar as you see fit. Using the <i>aButtons</i> parameter you can use any of the <a href="http://datatables.net/extras/tabletools/buttons">predefined buttons</a> or <a href="http://datatables.net/extras/tabletools/button_options">customised buttons</a>. The example below shows how TableTools can be initialised to provide only the 'copy-to-clipboard' and 'print view' options (i.e. no save to local file option is available).</p>
 | 
| 
 | 
    36 			
 | 
| 
 | 
    37 			
 | 
| 
 | 
    38 			<h1>Live example</h1>
 | 
| 
 | 
    39 			<div id="demo">
 | 
| 
 | 
    40 <table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
 | 
| 
 | 
    41 	<thead>
 | 
| 
 | 
    42 		<tr>
 | 
| 
 | 
    43 			<th>Rendering engine</th>
 | 
| 
 | 
    44 			<th>Browser</th>
 | 
| 
 | 
    45 			<th>Platform(s)</th>
 | 
| 
 | 
    46 			<th>Engine version</th>
 | 
| 
 | 
    47 			<th>CSS grade</th>
 | 
| 
 | 
    48 		</tr>
 | 
| 
 | 
    49 	</thead>
 | 
| 
 | 
    50 	<tfoot>
 | 
| 
 | 
    51 		<tr>
 | 
| 
 | 
    52 			<th>Rendering engine</th>
 | 
| 
 | 
    53 			<th>Browser</th>
 | 
| 
 | 
    54 			<th>Platform(s)</th>
 | 
| 
 | 
    55 			<th>Engine version</th>
 | 
| 
 | 
    56 			<th>CSS grade</th>
 | 
| 
 | 
    57 		</tr>
 | 
| 
 | 
    58 	</tfoot>
 | 
| 
 | 
    59 	<tbody>
 | 
| 
 | 
    60 		<tr class="odd_gradeX">
 | 
| 
 | 
    61 			<td>Trident</td>
 | 
| 
 | 
    62 			<td>Internet Explorer 4.0</td>
 | 
| 
 | 
    63 			<td>Win 95+ (Entity: &)</td>
 | 
| 
 | 
    64 			<td class="center">4</td>
 | 
| 
 | 
    65 			<td class="center">X</td>
 | 
| 
 | 
    66 		</tr>
 | 
| 
 | 
    67 		<tr class="even_gradeC">
 | 
| 
 | 
    68 			<td>Trident</td>
 | 
| 
 | 
    69 			<td>Internet Explorer 5.0</td>
 | 
| 
 | 
    70 			<td>Win 95+</td>
 | 
| 
 | 
    71 			<td class="center">5</td>
 | 
| 
 | 
    72 			<td class="center">C</td>
 | 
| 
 | 
    73 		</tr>
 | 
| 
 | 
    74 		<tr class="odd_gradeA">
 | 
| 
 | 
    75 			<td>Trident</td>
 | 
| 
 | 
    76 			<td>Internet Explorer 5.5</td>
 | 
| 
 | 
    77 			<td>Win 95+</td>
 | 
| 
 | 
    78 			<td class="center">5.5</td>
 | 
| 
 | 
    79 			<td class="center">A</td>
 | 
| 
 | 
    80 		</tr>
 | 
| 
 | 
    81 		<tr class="even_gradeA">
 | 
| 
 | 
    82 			<td>Trident</td>
 | 
| 
 | 
    83 			<td>Internet Explorer 6</td>
 | 
| 
 | 
    84 			<td>Win 98+</td>
 | 
| 
 | 
    85 			<td class="center">6</td>
 | 
| 
 | 
    86 			<td class="center">A</td>
 | 
| 
 | 
    87 		</tr>
 | 
| 
 | 
    88 		<tr class="odd_gradeA">
 | 
| 
 | 
    89 			<td>Trident</td>
 | 
| 
 | 
    90 			<td>Internet Explorer 7</td>
 | 
| 
 | 
    91 			<td>Win XP SP2+</td>
 | 
| 
 | 
    92 			<td class="center">7</td>
 | 
| 
 | 
    93 			<td class="center">A</td>
 | 
| 
 | 
    94 		</tr>
 | 
| 
 | 
    95 		<tr class="even_gradeA">
 | 
| 
 | 
    96 			<td>Trident</td>
 | 
| 
 | 
    97 			<td>AOL browser (AOL desktop)</td>
 | 
| 
 | 
    98 			<td>Win XP</td>
 | 
| 
 | 
    99 			<td class="center">6</td>
 | 
| 
 | 
   100 			<td class="center">A</td>
 | 
| 
 | 
   101 		</tr>
 | 
| 
 | 
   102 		<tr class="odd_gradeA">
 | 
| 
 | 
   103 			<td>Gecko (UTF-8: $¢€)</td>
 | 
| 
 | 
   104 			<td>Firefox 1.0</td>
 | 
| 
 | 
   105 			<td>Win 98+ / OSX.2+</td>
 | 
| 
 | 
   106 			<td class="center">1.7</td>
 | 
| 
 | 
   107 			<td class="center">A</td>
 | 
| 
 | 
   108 		</tr>
 | 
| 
 | 
   109 		<tr class="even_gradeA">
 | 
| 
 | 
   110 			<td>Gecko</td>
 | 
| 
 | 
   111 			<td>Firefox 1.5</td>
 | 
| 
 | 
   112 			<td>Win 98+ / OSX.2+</td>
 | 
| 
 | 
   113 			<td class="center">1.8</td>
 | 
| 
 | 
   114 			<td class="center">A</td>
 | 
| 
 | 
   115 		</tr>
 | 
| 
 | 
   116 		<tr class="odd_gradeA">
 | 
| 
 | 
   117 			<td>Gecko</td>
 | 
| 
 | 
   118 			<td>Firefox 2.0</td>
 | 
| 
 | 
   119 			<td>Win 98+ / OSX.2+</td>
 | 
| 
 | 
   120 			<td class="center">1.8</td>
 | 
| 
 | 
   121 			<td class="center">A</td>
 | 
| 
 | 
   122 		</tr>
 | 
| 
 | 
   123 		<tr class="even_gradeA">
 | 
| 
 | 
   124 			<td>Gecko</td>
 | 
| 
 | 
   125 			<td>Firefox 3.0</td>
 | 
| 
 | 
   126 			<td>Win 2k+ / OSX.3+</td>
 | 
| 
 | 
   127 			<td class="center">1.9</td>
 | 
| 
 | 
   128 			<td class="center">A</td>
 | 
| 
 | 
   129 		</tr>
 | 
| 
 | 
   130 		<tr class="odd_gradeA">
 | 
| 
 | 
   131 			<td>Gecko</td>
 | 
| 
 | 
   132 			<td>Camino 1.0</td>
 | 
| 
 | 
   133 			<td>OSX.2+</td>
 | 
| 
 | 
   134 			<td class="center">1.8</td>
 | 
| 
 | 
   135 			<td class="center">A</td>
 | 
| 
 | 
   136 		</tr>
 | 
| 
 | 
   137 		<tr class="even_gradeA">
 | 
| 
 | 
   138 			<td>Gecko</td>
 | 
| 
 | 
   139 			<td>Camino 1.5</td>
 | 
| 
 | 
   140 			<td>OSX.3+</td>
 | 
| 
 | 
   141 			<td class="center">1.8</td>
 | 
| 
 | 
   142 			<td class="center">A</td>
 | 
| 
 | 
   143 		</tr>
 | 
| 
 | 
   144 		<tr class="odd_gradeA">
 | 
| 
 | 
   145 			<td>Gecko</td>
 | 
| 
 | 
   146 			<td>Netscape 7.2</td>
 | 
| 
 | 
   147 			<td>Win 95+ / Mac OS 8.6-9.2</td>
 | 
| 
 | 
   148 			<td class="center">1.7</td>
 | 
| 
 | 
   149 			<td class="center">A</td>
 | 
| 
 | 
   150 		</tr>
 | 
| 
 | 
   151 		<tr class="even_gradeA">
 | 
| 
 | 
   152 			<td>Gecko</td>
 | 
| 
 | 
   153 			<td>Netscape Browser 8</td>
 | 
| 
 | 
   154 			<td>Win 98SE+</td>
 | 
| 
 | 
   155 			<td class="center">1.7</td>
 | 
| 
 | 
   156 			<td class="center">A</td>
 | 
| 
 | 
   157 		</tr>
 | 
| 
 | 
   158 		<tr class="odd_gradeA">
 | 
| 
 | 
   159 			<td>Gecko</td>
 | 
| 
 | 
   160 			<td>Netscape Navigator 9</td>
 | 
| 
 | 
   161 			<td>Win 98+ / OSX.2+</td>
 | 
| 
 | 
   162 			<td class="center">1.8</td>
 | 
| 
 | 
   163 			<td class="center">A</td>
 | 
| 
 | 
   164 		</tr>
 | 
| 
 | 
   165 		<tr class="even_gradeA">
 | 
| 
 | 
   166 			<td>Gecko</td>
 | 
| 
 | 
   167 			<td>Mozilla 1.0</td>
 | 
| 
 | 
   168 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   169 			<td class="center">1</td>
 | 
| 
 | 
   170 			<td class="center">A</td>
 | 
| 
 | 
   171 		</tr>
 | 
| 
 | 
   172 		<tr class="odd_gradeA">
 | 
| 
 | 
   173 			<td>Gecko</td>
 | 
| 
 | 
   174 			<td>Mozilla 1.1</td>
 | 
| 
 | 
   175 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   176 			<td class="center">1.1</td>
 | 
| 
 | 
   177 			<td class="center">A</td>
 | 
| 
 | 
   178 		</tr>
 | 
| 
 | 
   179 		<tr class="even_gradeA">
 | 
| 
 | 
   180 			<td>Gecko</td>
 | 
| 
 | 
   181 			<td>Mozilla 1.2</td>
 | 
| 
 | 
   182 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   183 			<td class="center">1.2</td>
 | 
| 
 | 
   184 			<td class="center">A</td>
 | 
| 
 | 
   185 		</tr>
 | 
| 
 | 
   186 		<tr class="odd_gradeA">
 | 
| 
 | 
   187 			<td>Gecko</td>
 | 
| 
 | 
   188 			<td>Mozilla 1.3</td>
 | 
| 
 | 
   189 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   190 			<td class="center">1.3</td>
 | 
| 
 | 
   191 			<td class="center">A</td>
 | 
| 
 | 
   192 		</tr>
 | 
| 
 | 
   193 		<tr class="even_gradeA">
 | 
| 
 | 
   194 			<td>Gecko</td>
 | 
| 
 | 
   195 			<td>Mozilla 1.4</td>
 | 
| 
 | 
   196 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   197 			<td class="center">1.4</td>
 | 
| 
 | 
   198 			<td class="center">A</td>
 | 
| 
 | 
   199 		</tr>
 | 
| 
 | 
   200 		<tr class="odd_gradeA">
 | 
| 
 | 
   201 			<td>Gecko</td>
 | 
| 
 | 
   202 			<td>Mozilla 1.5</td>
 | 
| 
 | 
   203 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   204 			<td class="center">1.5</td>
 | 
| 
 | 
   205 			<td class="center">A</td>
 | 
| 
 | 
   206 		</tr>
 | 
| 
 | 
   207 		<tr class="even_gradeA">
 | 
| 
 | 
   208 			<td>Gecko</td>
 | 
| 
 | 
   209 			<td>Mozilla 1.6</td>
 | 
| 
 | 
   210 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   211 			<td class="center">1.6</td>
 | 
| 
 | 
   212 			<td class="center">A</td>
 | 
| 
 | 
   213 		</tr>
 | 
| 
 | 
   214 		<tr class="odd_gradeA">
 | 
| 
 | 
   215 			<td>Gecko</td>
 | 
| 
 | 
   216 			<td>Mozilla 1.7</td>
 | 
| 
 | 
   217 			<td>Win 98+ / OSX.1+</td>
 | 
| 
 | 
   218 			<td class="center">1.7</td>
 | 
| 
 | 
   219 			<td class="center">A</td>
 | 
| 
 | 
   220 		</tr>
 | 
| 
 | 
   221 		<tr class="even_gradeA">
 | 
| 
 | 
   222 			<td>Gecko</td>
 | 
| 
 | 
   223 			<td>Mozilla 1.8</td>
 | 
| 
 | 
   224 			<td>Win 98+ / OSX.1+</td>
 | 
| 
 | 
   225 			<td class="center">1.8</td>
 | 
| 
 | 
   226 			<td class="center">A</td>
 | 
| 
 | 
   227 		</tr>
 | 
| 
 | 
   228 		<tr class="odd_gradeA">
 | 
| 
 | 
   229 			<td>Gecko</td>
 | 
| 
 | 
   230 			<td>Seamonkey 1.1</td>
 | 
| 
 | 
   231 			<td>Win 98+ / OSX.2+</td>
 | 
| 
 | 
   232 			<td class="center">1.8</td>
 | 
| 
 | 
   233 			<td class="center">A</td>
 | 
| 
 | 
   234 		</tr>
 | 
| 
 | 
   235 		<tr class="even_gradeA">
 | 
| 
 | 
   236 			<td>Gecko</td>
 | 
| 
 | 
   237 			<td>Epiphany 2.20</td>
 | 
| 
 | 
   238 			<td>Gnome</td>
 | 
| 
 | 
   239 			<td class="center">1.8</td>
 | 
| 
 | 
   240 			<td class="center">A</td>
 | 
| 
 | 
   241 		</tr>
 | 
| 
 | 
   242 		<tr class="odd_gradeA">
 | 
| 
 | 
   243 			<td>Webkit</td>
 | 
| 
 | 
   244 			<td>Safari 1.2</td>
 | 
| 
 | 
   245 			<td>OSX.3</td>
 | 
| 
 | 
   246 			<td class="center">125.5</td>
 | 
| 
 | 
   247 			<td class="center">A</td>
 | 
| 
 | 
   248 		</tr>
 | 
| 
 | 
   249 		<tr class="even_gradeA">
 | 
| 
 | 
   250 			<td>Webkit</td>
 | 
| 
 | 
   251 			<td>Safari 1.3</td>
 | 
| 
 | 
   252 			<td>OSX.3</td>
 | 
| 
 | 
   253 			<td class="center">312.8</td>
 | 
| 
 | 
   254 			<td class="center">A</td>
 | 
| 
 | 
   255 		</tr>
 | 
| 
 | 
   256 		<tr class="odd_gradeA">
 | 
| 
 | 
   257 			<td>Webkit</td>
 | 
| 
 | 
   258 			<td>Safari 2.0</td>
 | 
| 
 | 
   259 			<td>OSX.4+</td>
 | 
| 
 | 
   260 			<td class="center">419.3</td>
 | 
| 
 | 
   261 			<td class="center">A</td>
 | 
| 
 | 
   262 		</tr>
 | 
| 
 | 
   263 		<tr class="even_gradeA">
 | 
| 
 | 
   264 			<td>Webkit</td>
 | 
| 
 | 
   265 			<td>Safari 3.0</td>
 | 
| 
 | 
   266 			<td>OSX.4+</td>
 | 
| 
 | 
   267 			<td class="center">522.1</td>
 | 
| 
 | 
   268 			<td class="center">A</td>
 | 
| 
 | 
   269 		</tr>
 | 
| 
 | 
   270 		<tr class="odd_gradeA">
 | 
| 
 | 
   271 			<td>Webkit</td>
 | 
| 
 | 
   272 			<td>OmniWeb 5.5</td>
 | 
| 
 | 
   273 			<td>OSX.4+</td>
 | 
| 
 | 
   274 			<td class="center">420</td>
 | 
| 
 | 
   275 			<td class="center">A</td>
 | 
| 
 | 
   276 		</tr>
 | 
| 
 | 
   277 		<tr class="even_gradeA">
 | 
| 
 | 
   278 			<td>Webkit</td>
 | 
| 
 | 
   279 			<td>iPod Touch / iPhone</td>
 | 
| 
 | 
   280 			<td>iPod</td>
 | 
| 
 | 
   281 			<td class="center">420.1</td>
 | 
| 
 | 
   282 			<td class="center">A</td>
 | 
| 
 | 
   283 		</tr>
 | 
| 
 | 
   284 		<tr class="odd_gradeA">
 | 
| 
 | 
   285 			<td>Webkit</td>
 | 
| 
 | 
   286 			<td>S60</td>
 | 
| 
 | 
   287 			<td>S60</td>
 | 
| 
 | 
   288 			<td class="center">413</td>
 | 
| 
 | 
   289 			<td class="center">A</td>
 | 
| 
 | 
   290 		</tr>
 | 
| 
 | 
   291 		<tr class="even_gradeA">
 | 
| 
 | 
   292 			<td>Presto</td>
 | 
| 
 | 
   293 			<td>Opera 7.0</td>
 | 
| 
 | 
   294 			<td>Win 95+ / OSX.1+</td>
 | 
| 
 | 
   295 			<td class="center">-</td>
 | 
| 
 | 
   296 			<td class="center">A</td>
 | 
| 
 | 
   297 		</tr>
 | 
| 
 | 
   298 		<tr class="odd_gradeA">
 | 
| 
 | 
   299 			<td>Presto</td>
 | 
| 
 | 
   300 			<td>Opera 7.5</td>
 | 
| 
 | 
   301 			<td>Win 95+ / OSX.2+</td>
 | 
| 
 | 
   302 			<td class="center">-</td>
 | 
| 
 | 
   303 			<td class="center">A</td>
 | 
| 
 | 
   304 		</tr>
 | 
| 
 | 
   305 		<tr class="even_gradeA">
 | 
| 
 | 
   306 			<td>Presto</td>
 | 
| 
 | 
   307 			<td>Opera 8.0</td>
 | 
| 
 | 
   308 			<td>Win 95+ / OSX.2+</td>
 | 
| 
 | 
   309 			<td class="center">-</td>
 | 
| 
 | 
   310 			<td class="center">A</td>
 | 
| 
 | 
   311 		</tr>
 | 
| 
 | 
   312 		<tr class="odd_gradeA">
 | 
| 
 | 
   313 			<td>Presto</td>
 | 
| 
 | 
   314 			<td>Opera 8.5</td>
 | 
| 
 | 
   315 			<td>Win 95+ / OSX.2+</td>
 | 
| 
 | 
   316 			<td class="center">-</td>
 | 
| 
 | 
   317 			<td class="center">A</td>
 | 
| 
 | 
   318 		</tr>
 | 
| 
 | 
   319 		<tr class="even_gradeA">
 | 
| 
 | 
   320 			<td>Presto</td>
 | 
| 
 | 
   321 			<td>Opera 9.0</td>
 | 
| 
 | 
   322 			<td>Win 95+ / OSX.3+</td>
 | 
| 
 | 
   323 			<td class="center">-</td>
 | 
| 
 | 
   324 			<td class="center">A</td>
 | 
| 
 | 
   325 		</tr>
 | 
| 
 | 
   326 		<tr class="odd_gradeA">
 | 
| 
 | 
   327 			<td>Presto</td>
 | 
| 
 | 
   328 			<td>Opera 9.2</td>
 | 
| 
 | 
   329 			<td>Win 88+ / OSX.3+</td>
 | 
| 
 | 
   330 			<td class="center">-</td>
 | 
| 
 | 
   331 			<td class="center">A</td>
 | 
| 
 | 
   332 		</tr>
 | 
| 
 | 
   333 		<tr class="even_gradeA">
 | 
| 
 | 
   334 			<td>Presto</td>
 | 
| 
 | 
   335 			<td>Opera 9.5</td>
 | 
| 
 | 
   336 			<td>Win 88+ / OSX.3+</td>
 | 
| 
 | 
   337 			<td class="center">-</td>
 | 
| 
 | 
   338 			<td class="center">A</td>
 | 
| 
 | 
   339 		</tr>
 | 
| 
 | 
   340 		<tr class="odd_gradeA">
 | 
| 
 | 
   341 			<td>Presto</td>
 | 
| 
 | 
   342 			<td>Opera for Wii</td>
 | 
| 
 | 
   343 			<td>Wii</td>
 | 
| 
 | 
   344 			<td class="center">-</td>
 | 
| 
 | 
   345 			<td class="center">A</td>
 | 
| 
 | 
   346 		</tr>
 | 
| 
 | 
   347 		<tr class="even_gradeA">
 | 
| 
 | 
   348 			<td>Presto</td>
 | 
| 
 | 
   349 			<td>Nokia N800</td>
 | 
| 
 | 
   350 			<td>N800</td>
 | 
| 
 | 
   351 			<td class="center">-</td>
 | 
| 
 | 
   352 			<td class="center">A</td>
 | 
| 
 | 
   353 		</tr>
 | 
| 
 | 
   354 		<tr class="odd_gradeA">
 | 
| 
 | 
   355 			<td>Presto</td>
 | 
| 
 | 
   356 			<td>Nintendo DS browser</td>
 | 
| 
 | 
   357 			<td>Nintendo DS</td>
 | 
| 
 | 
   358 			<td class="center">8.5</td>
 | 
| 
 | 
   359 			<td class="center">C/A<sup>1</sup></td>
 | 
| 
 | 
   360 		</tr>
 | 
| 
 | 
   361 		<tr class="even_gradeC">
 | 
| 
 | 
   362 			<td>KHTML</td>
 | 
| 
 | 
   363 			<td>Konqureror 3.1</td>
 | 
| 
 | 
   364 			<td>KDE 3.1</td>
 | 
| 
 | 
   365 			<td class="center">3.1</td>
 | 
| 
 | 
   366 			<td class="center">C</td>
 | 
| 
 | 
   367 		</tr>
 | 
| 
 | 
   368 		<tr class="odd_gradeA">
 | 
| 
 | 
   369 			<td>KHTML</td>
 | 
| 
 | 
   370 			<td>Konqureror 3.3</td>
 | 
| 
 | 
   371 			<td>KDE 3.3</td>
 | 
| 
 | 
   372 			<td class="center">3.3</td>
 | 
| 
 | 
   373 			<td class="center">A</td>
 | 
| 
 | 
   374 		</tr>
 | 
| 
 | 
   375 		<tr class="even_gradeA">
 | 
| 
 | 
   376 			<td>KHTML</td>
 | 
| 
 | 
   377 			<td>Konqureror 3.5</td>
 | 
| 
 | 
   378 			<td>KDE 3.5</td>
 | 
| 
 | 
   379 			<td class="center">3.5</td>
 | 
| 
 | 
   380 			<td class="center">A</td>
 | 
| 
 | 
   381 		</tr>
 | 
| 
 | 
   382 		<tr class="odd_gradeX">
 | 
| 
 | 
   383 			<td>Tasman</td>
 | 
| 
 | 
   384 			<td>Internet Explorer 4.5</td>
 | 
| 
 | 
   385 			<td>Mac OS 8-9</td>
 | 
| 
 | 
   386 			<td class="center">-</td>
 | 
| 
 | 
   387 			<td class="center">X</td>
 | 
| 
 | 
   388 		</tr>
 | 
| 
 | 
   389 		<tr class="even_gradeC">
 | 
| 
 | 
   390 			<td>Tasman</td>
 | 
| 
 | 
   391 			<td>Internet Explorer 5.1</td>
 | 
| 
 | 
   392 			<td>Mac OS 7.6-9</td>
 | 
| 
 | 
   393 			<td class="center">1</td>
 | 
| 
 | 
   394 			<td class="center">C</td>
 | 
| 
 | 
   395 		</tr>
 | 
| 
 | 
   396 		<tr class="odd_gradeC">
 | 
| 
 | 
   397 			<td>Tasman</td>
 | 
| 
 | 
   398 			<td>Internet Explorer 5.2</td>
 | 
| 
 | 
   399 			<td>Mac OS 8-X</td>
 | 
| 
 | 
   400 			<td class="center">1</td>
 | 
| 
 | 
   401 			<td class="center">C</td>
 | 
| 
 | 
   402 		</tr>
 | 
| 
 | 
   403 		<tr class="even_gradeA">
 | 
| 
 | 
   404 			<td>Misc</td>
 | 
| 
 | 
   405 			<td>NetFront 3.1</td>
 | 
| 
 | 
   406 			<td>Embedded devices</td>
 | 
| 
 | 
   407 			<td class="center">-</td>
 | 
| 
 | 
   408 			<td class="center">C</td>
 | 
| 
 | 
   409 		</tr>
 | 
| 
 | 
   410 		<tr class="odd_gradeA">
 | 
| 
 | 
   411 			<td>Misc</td>
 | 
| 
 | 
   412 			<td>NetFront 3.4</td>
 | 
| 
 | 
   413 			<td>Embedded devices</td>
 | 
| 
 | 
   414 			<td class="center">-</td>
 | 
| 
 | 
   415 			<td class="center">A</td>
 | 
| 
 | 
   416 		</tr>
 | 
| 
 | 
   417 		<tr class="even_gradeX">
 | 
| 
 | 
   418 			<td>Misc</td>
 | 
| 
 | 
   419 			<td>Dillo 0.8</td>
 | 
| 
 | 
   420 			<td>Embedded devices</td>
 | 
| 
 | 
   421 			<td class="center">-</td>
 | 
| 
 | 
   422 			<td class="center">X</td>
 | 
| 
 | 
   423 		</tr>
 | 
| 
 | 
   424 		<tr class="odd_gradeX">
 | 
| 
 | 
   425 			<td>Misc</td>
 | 
| 
 | 
   426 			<td>Links</td>
 | 
| 
 | 
   427 			<td>Text only</td>
 | 
| 
 | 
   428 			<td class="center">-</td>
 | 
| 
 | 
   429 			<td class="center">X</td>
 | 
| 
 | 
   430 		</tr>
 | 
| 
 | 
   431 		<tr class="even_gradeX">
 | 
| 
 | 
   432 			<td>Misc</td>
 | 
| 
 | 
   433 			<td>Lynx</td>
 | 
| 
 | 
   434 			<td>Text only</td>
 | 
| 
 | 
   435 			<td class="center">-</td>
 | 
| 
 | 
   436 			<td class="center">X</td>
 | 
| 
 | 
   437 		</tr>
 | 
| 
 | 
   438 		<tr class="odd_gradeC">
 | 
| 
 | 
   439 			<td>Misc</td>
 | 
| 
 | 
   440 			<td>IE Mobile</td>
 | 
| 
 | 
   441 			<td>Windows Mobile 6</td>
 | 
| 
 | 
   442 			<td class="center">-</td>
 | 
| 
 | 
   443 			<td class="center">C</td>
 | 
| 
 | 
   444 		</tr>
 | 
| 
 | 
   445 		<tr class="even_gradeC">
 | 
| 
 | 
   446 			<td>Misc</td>
 | 
| 
 | 
   447 			<td>PSP browser</td>
 | 
| 
 | 
   448 			<td>PSP</td>
 | 
| 
 | 
   449 			<td class="center">-</td>
 | 
| 
 | 
   450 			<td class="center">C</td>
 | 
| 
 | 
   451 		</tr>
 | 
| 
 | 
   452 		<tr class="odd_gradeU">
 | 
| 
 | 
   453 			<td>Other browsers</td>
 | 
| 
 | 
   454 			<td>All others</td>
 | 
| 
 | 
   455 			<td>-</td>
 | 
| 
 | 
   456 			<td class="center">-</td>
 | 
| 
 | 
   457 			<td class="center">U</td>
 | 
| 
 | 
   458 		</tr>
 | 
| 
 | 
   459 	</tbody>
 | 
| 
 | 
   460 </table>
 | 
| 
 | 
   461 			</div>
 | 
| 
 | 
   462 			<div class="spacer"></div>
 | 
| 
 | 
   463 			
 | 
| 
 | 
   464 			
 | 
| 
 | 
   465 			<h1>Initialisation code</h1>
 | 
| 
 | 
   466 			<pre>$(document).ready( function () {
 | 
| 
 | 
   467 	$('#example').dataTable( {
 | 
| 
 | 
   468 		"sDom": 'T<"clear">lfrtip',
 | 
| 
 | 
   469 		"oTableTools": {
 | 
| 
 | 
   470 			"aButtons": [ "copy", "print" ]
 | 
| 
 | 
   471 		}
 | 
| 
 | 
   472 	} );
 | 
| 
 | 
   473 } );</pre>
 | 
| 
 | 
   474 
 | 
| 
 | 
   475 
 | 
| 
 | 
   476 			<h1>Other examples</h1>
 | 
| 
 | 
   477 			<ul>
 | 
| 
 | 
   478 				<li><a href="index.html">Basic initialisation</a></li>
 | 
| 
 | 
   479 				<li><a href="swf_path.html">Setting the SWF path</a></li>
 | 
| 
 | 
   480 				<li><a href="alter_buttons.html">Custom button arrangement</a></li>
 | 
| 
 | 
   481 				<li><a href="button_text.html">Button text alteration</a></li>
 | 
| 
 | 
   482 				<li><a href="collection.html">Using button collections</a></li>
 | 
| 
 | 
   483 				<li><a href="theme.html">Using jQuery UI themes</a></li>
 | 
| 
 | 
   484 				<li><a href="bootstrap.html">Styling with Twitter Bootstrap</a></li>
 | 
| 
 | 
   485 				<li><a href="multi_instance.html">Multiple TableTools toolbars for a single table</a></li>
 | 
| 
 | 
   486 				<li><a href="multiple_tables.html">Multiple DataTables with a single initialisation</a></li>
 | 
| 
 | 
   487 				<li><a href="select_multi.html">User selectable rows (multiple rows)</a></li>
 | 
| 
 | 
   488 				<li><a href="select_single.html">User selectable rows (single row)</a></li>
 | 
| 
 | 
   489 				<li><a href="alt_init.html">Alternative initialisation using 'new TableTools()'</a></li>
 | 
| 
 | 
   490 				<li><a href="defaults.html">Altering the TableTools defaults</a></li>
 | 
| 
 | 
   491 				<li><a href="plug-in.html">TableTools plug-in buttons</a></li>
 | 
| 
 | 
   492 				<li><a href="pdf_message.html">Customising the PDF output (adding text and orientation)</a></li>
 | 
| 
 | 
   493 			</ul>
 | 
| 
 | 
   494 			
 | 
| 
 | 
   495 			
 | 
| 
 | 
   496 			<div id="footer" style="text-align:center;">
 | 
| 
 | 
   497 				<span style="font-size:10px;">
 | 
| 
 | 
   498 					TableTools and DataTables © Allan Jardine 2009-2011.<br>
 | 
| 
 | 
   499 					Flash 10 save / copy operations are performed by a modified version of <a href="http://code.google.com/p/zeroclipboard/">Zero Clipboard</a>.<br>
 | 
| 
 | 
   500 					The icons used in the toolbar are modified from <a href="http://www.addictedtocoffee.de/">Oliver Twardowski's</a> <a href="http://www.smashingmagazine.com/2009/05/20/flavour-extended-the-ultimate-icon-set-for-web-designers/">Flavours Icon set</a>.
 | 
| 
 | 
   501 				</span>
 | 
| 
 | 
   502 			</div>
 | 
| 
 | 
   503 		</div>
 | 
| 
 | 
   504 	</body>
 | 
| 
 | 
   505 </html> |