mirror of
https://github.com/koalyptus/TableFilter.git
synced 2024-04-30 22:02:49 +02:00
Update alternating-rows.html
This commit is contained in:
koalyptus
GitHub
parent
623f1474e5
commit
0313848860
|
|
@ -2,510 +2,8 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Alternating rows | TableFilter</title>
|
||||
|
||||
<!-- Bootstrap core CSS -->
|
||||
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
|
||||
|
||||
<!-- Bootstrap theme -->
|
||||
<link href="assets/css/bootstrap-theme.min.css" rel="stylesheet">
|
||||
|
||||
<!-- Custom styles for this template -->
|
||||
<link href="assets/css/theme.css" rel="stylesheet">
|
||||
|
||||
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
||||
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
|
||||
<!--[if lt IE 9]>
|
||||
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
|
||||
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
<meta http-equiv="refresh" content="0;URL='https://www.tablefilter.com/alternating-rows.html'">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
<!-- Fixed navbar -->
|
||||
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" href="./">TableFilter</a>
|
||||
</div>
|
||||
<div class="navbar-collapse collapse">
|
||||
<ul class="nav navbar-nav">
|
||||
<!-- you can exclude pages using {{#isnt}} helper: {{#isnt data.title 'Blog'}} -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li>
|
||||
<a href="examples.html">Examples</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li class="dropdown">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Github <b class="caret"></b></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./docs" target="_blank">Docs</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div><!--/.nav-collapse -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="container theme-showcase" role="main">
|
||||
|
||||
|
||||
|
||||
<h1>Alternating rows</h1>
|
||||
<p>
|
||||
Enable alternating background rows with the <code>alternate_rows</code>
|
||||
option.
|
||||
</p>
|
||||
|
||||
|
||||
<table id="demo" class="cities">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>From</th>
|
||||
<th>Destination</th>
|
||||
<th>Road Distance (km)</th>
|
||||
<th>By Air (hrs)</th>
|
||||
<th>By Rail (hrs)</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Sydney</td>
|
||||
<td>Adelaide</td>
|
||||
<td>1412</td>
|
||||
<td>1.4</td>
|
||||
<td>25.3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sydney</td>
|
||||
<td>Brisbane</td>
|
||||
<td>982</td>
|
||||
<td>1.5</td>
|
||||
<td>16</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sydney</td>
|
||||
<td>Canberra</td>
|
||||
<td>286</td>
|
||||
<td>.6</td>
|
||||
<td>4.3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sydney</td>
|
||||
<td>Melbourne</td>
|
||||
<td>872</td>
|
||||
<td>1.1</td>
|
||||
<td>10.5</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adelaide</td>
|
||||
<td>Perth</td>
|
||||
<td>2781</td>
|
||||
<td>3.1</td>
|
||||
<td>38</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adelaide</td>
|
||||
<td>Alice Springs</td>
|
||||
<td>1533</td>
|
||||
<td>2</td>
|
||||
<td>20.25</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Adelaide</td>
|
||||
<td>Brisbane</td>
|
||||
<td>2045</td>
|
||||
<td>2.15</td>
|
||||
<td>40</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
|
||||
<script src="tablefilter/tablefilter.js"></script>
|
||||
|
||||
|
||||
<script data-config>
|
||||
var tf = new TableFilter('demo', {
|
||||
base_path: 'tablefilter/',
|
||||
alternate_rows: true
|
||||
});
|
||||
tf.init();
|
||||
</script>
|
||||
|
||||
<hr>
|
||||
<ul class="nav nav-pills">
|
||||
<li class="active">
|
||||
<a data-toggle="tab" href="#js">JS</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-toggle="tab" href="#html">HTML</a>
|
||||
</li>
|
||||
<li>
|
||||
<a data-toggle="tab" href="#css">CSS</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="tab-content">
|
||||
<div id="js" class="tab-pane fade in active">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--
|
||||
DO NOT COPY: NOT PART OF TABLEFILTER
|
||||
-->
|
||||
<pre class="js">
|
||||
<code class="javascript"></code>
|
||||
</pre>
|
||||
<script src="assets/js/js-code-in-pre.js"></script>
|
||||
<!-- -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div id="html" class="tab-pane fade">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--
|
||||
DO NOT COPY: NOT PART OF TABLEFILTER
|
||||
-->
|
||||
<pre class="html">
|
||||
<code class="xml"></code>
|
||||
</pre>
|
||||
<script src="assets/js/html-code-in-pre.js"></script>
|
||||
<!-- -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div id="css" class="tab-pane fade">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--
|
||||
DO NOT COPY: NOT PART OF TABLEFILTER
|
||||
-->
|
||||
<pre class="css">
|
||||
<code class="css"></code>
|
||||
</pre>
|
||||
<script src="assets/js/css-code-in-pre.js"></script>
|
||||
<!-- -->
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<nav class="navbar navbar-default navbar-bottom">
|
||||
<div class="container">
|
||||
<ul class="nav navbar-nav">
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter">Repo</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://github.com/koalyptus/TableFilter/wiki">Wiki</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="./docs" target="_blank">Docs</a>
|
||||
</li>
|
||||
</ul>
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<li>
|
||||
<p>
|
||||
<form action="https://www.paypal.com/cgi-bin/webscr" method="post" target="_blank">
|
||||
<input type="hidden" name="cmd" value="_donations">
|
||||
<input type="hidden" name="business" value="maxgug@hotmail.com">
|
||||
<input type="hidden" name="lc" value="BM">
|
||||
<input type="hidden" name="item_name" value="TableFilter">
|
||||
<input type="hidden" name="no_note" value="0">
|
||||
<input type="hidden" name="currency_code" value="USD">
|
||||
<input type="hidden" name="bn" value="PP-DonationsBF:btn_donate_LG.gif:NonHosted">
|
||||
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donate_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
|
||||
<img alt="" border="0" src="https://www.paypalobjects.com/en_AU/i/scr/pixel.gif" width="1" height="1">
|
||||
</form>
|
||||
</p>
|
||||
</li>
|
||||
<li>
|
||||
|
||||
<a href="https://flattr.com/submit/auto?user_id=koalyptus&
|
||||
url=https%3A%2F%2Fgithub.com%2Fkoalyptus%2FTablefilter">
|
||||
<img src="https://api.flattr.com/button/flattr-badge-large.png"
|
||||
alt="TableFilter - A Javascript library making HTML tables filterable
|
||||
and a bit more" />
|
||||
</a>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
|
||||
<script src="https://code.jquery.com/jquery.min.js"></script>
|
||||
<!-- Include all compiled plugins (below), or include individual files as needed -->
|
||||
<script src="assets/js/bootstrap.min.js"></script>
|
||||
|
||||
<script src="assets/js/github-fork-me.js"></script>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!--
|
||||
DO NOT COPY: NOT PART OF TABLEFILTER
|
||||
-->
|
||||
<link rel="stylesheet" href="assets/js/highlight/styles/monokai-sublime.css">
|
||||
<script src="assets/js/highlight/highlight.pack.js"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<!-- -->
|
||||
|
||||
|
||||
<script type="text/javascript"
|
||||
src="//s7.addthis.com/js/300/addthis_widget.js#pubid=maxgug"
|
||||
async="async"></script>
|
||||
|
||||
<script>
|
||||
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
|
||||
|
||||
ga('create', 'UA-68429903-1', 'auto');
|
||||
ga('send', 'pageview');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue