git://source.jalview.org / proteocache.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Merge branch 'master' into PROT-9-webservice
[proteocache.git] / webapp / resources / datatables-1.9.4 / extras / Scroller / api_scrolling.html
diff --git a/webapp/resources/datatables-1.9.4/extras/Scroller/api_scrolling.html b/webapp/resources/datatables-1.9.4/extras/Scroller/api_scrolling.html
new file mode 100644 (file)
index 0000000..d640d72
--- /dev/null
+++ b/webapp/resources/datatables-1.9.4/extras/Scroller/api_scrolling.html
@@ -0,0 +1,83 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+       <head>
+               <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+               <link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico" />
+               
+               <title>DataTables example</title>
+               <style type="text/css">
+                       @import "../../media/css/demo_page.css";
+                       @import "../../media/css/demo_table.css";
+                       @import "media/css/dataTables.scroller.css";
+               </style>
+               <script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>
+               <script type="text/javascript" language="javascript" src="../../media/js/jquery.dataTables.js"></script>
+               <script type="text/javascript" language="javascript" src="media/js/dataTables.scroller.js"></script>
+               <script type="text/javascript" charset="utf-8">
+                       $(document).ready(function() {
+                               $('#example').dataTable( {
+                                       "sScrollY": "200px",
+                                       "sAjaxSource": "media/data/2500.txt",
+                                       "sDom": "frtiS",
+                                       "bDeferRender": true,
+                                       "fnInitComplete": function () {
+                                               this.fnSettings().oScroller.fnScrollToRow( 1000 );
+                                       }
+                               } );
+                       } );
+               </script>
+       </head>
+       <body id="dt_example">
+               <div id="container" style="width:980px">
+                       <div class="full_width big">
+                               Scroller API example
+                       </div>
+                       
+                       <h1>Preamble</h1>
+                       <p>This example shows a trivial use of the Scroller API to scroll the table to row 1000 once the table has been loaded. Any number could be used here, and a small animated effect is used to provide visual feedback to the user (this can be disabled by passed false as a second parameter to fnScrollToRow).</p>
+                       
+                       <h1>Live example</h1>
+                       <div id="demo">
+<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
+       <thead>
+               <tr>
+                       <th>ID</th>
+                       <th>First name</th>
+                       <th>Last name</th>
+                       <th>ZIP</th>
+                       <th width="33%">Country</th>
+               </tr>
+       </thead>
+</table>
+                       </div>
+                       <div class="spacer"></div>
+                       
+                       
+                       <h1>Initialisation code</h1>
+                       <pre>$(document).ready(function() {
+       $('#example').dataTable( {
+               "sScrollY": "200px",
+               "sAjaxSource": "media/data/2500.txt",
+               "sDom": "frtiS",
+               "bDeferRender": true,
+               "fnInitComplete": function () {
+                       this.fnSettings().oScroller.fnScrollToRow( 1000 );
+               }
+       } );
+} );</pre>
+                       
+                       
+                       <h1>Other examples</h1>
+                       <div class="demo_links">
+                               <ul>
+                                       <li><a href="index.html">Basic initialisation of Scroller</a></li>
+                                       <li><a href="state_saving.html">State saving</a></li>
+                                       <li><a href="api_scrolling.html">API - pragmatically move to a row</a></li>
+                                       <li><a href="server-side_processing.html">Server-side processing with Scroller</a></li>
+                                       <li><a href="large_js_source.html">50'000 rows in a table - client-side generated data</a></li>
+                               </ul>
+                       </div>
+                       
+               </div>
+       </body>
+</html>
\ No newline at end of file