rooty/DataTables
1
0
Fork 0
mirror of https://github.com/DataTables/DataTables.git synced 2025-01-18 11:52:11 +01:00
Code Issues Releases Activity

Update - examples: Better responsive CSS handling

Browse Source 
- Drop the multi-column layout when using devices with smaller screen
  space
This commit is contained in:
Allan Jardine 2014-03-04 08:51:19 +00:00
parent a9687655ea
commit 55e965de0a
12 changed files with 41 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.datatables-commit-sync
View File

@ -1 +1 @@
6ce73e2332ab123287d3333b965c0abdc038f93c
25c0097a157043b27983e4f8f4687f2c8b9d4aff

1
examples/advanced_init/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

1
examples/ajax/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

1
examples/api/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

1
examples/basic_init/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

18
examples/basic_init/zero_configuration.html
View File

@ -20,14 +20,7 @@
$(document).ready(function() {
var oTable = $('#example').dataTable( {
"fnInitComplete" : function () {
$('table.dataTable td').click(function() {
var position=oTable.fnGetPosition(this);
alert("Row is "+position[0]);
});
}
} );
$('#example').dataTable();
} );
@ -542,14 +535,7 @@ $(document).ready(function() {
<div class="js">
<p>The Javascript shown below is used to initialise the table shown in this
example:</p><code class="multiline brush: js;">$(document).ready(function() {
var oTable = $('#example').dataTable( {
&quot;fnInitComplete&quot; : function () {
$('table.dataTable td').click(function() {
var position=oTable.fnGetPosition(this);
alert(&quot;Row is &quot;+position[0]);
});
}
} );
$('#example').dataTable();
} );</code>
<p>In addition to the above code, the following Javascript library files are loaded for use in this

1
examples/data_sources/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

1
examples/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="./resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="./resources/demo.css">
<script type="text/javascript" language="javascript" src="../media/js/jquery.js"></script>

1
examples/plug-ins/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

31
examples/resources/demo.css
View File

@ -21,7 +21,7 @@ body {
div.container {
width: 980px;
max-width: 980px;
margin: 0 auto;
}
@ -126,7 +126,7 @@ div.footer {
}
div.footer > div.liner {
width: 960px;
max-width: 960px;
margin: 0 auto;
}
@ -287,3 +287,30 @@ div.column_half {
width: 49%;
padding-right: 1%;
}
@media only screen and (max-width : 979px) {
div.container,
div.footer {
padding: 0 1em;
}
}
@media only screen and (max-width : 779px) {
div.info {
-webkit-column-count: 1;
-moz-column-count: 1;
-ms-column-count: 1;
-o-column-count: 1;
column-count: 1;
}
div.toc {
-webkit-column-count: 1;
-moz-column-count: 1;
-ms-column-count: 1;
-o-column-count: 1;
column-count: 1;
}
}

1
examples/server_side/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>

1
examples/styling/index.html
View File

@ -3,6 +3,7 @@
<head>
<meta charset="utf-8">
<link rel="shortcut icon" type="image/ico" href="http://www.datatables.net/favicon.ico">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="../resources/syntax/shCore.css">
<link rel="stylesheet" type="text/css" href="../resources/demo.css">
<script type="text/javascript" language="javascript" src="../../media/js/jquery.js"></script>