ufologist/mobile-fixed-columns-table
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

给予我灵感的那个半成品

Browse Source
This commit is contained in:
ufologist
2013-07-04 09:03:24 -07:00
parent a1084d7ac2
commit 75f352c996
4 changed files with 2171 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
inspiration/css/defaultTheme.css Normal file
View File

@@ -0,0 +1,92 @@
/*!
* jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin
*
* Copyright (c) 2011 Mark Malek
* http://fixedheadertable.com
*
* Licensed under MIT
* http://www.opensource.org/licenses/mit-license.php
*
* http://docs.jquery.com/Plugins/Authoring
* jQuery authoring guidelines
*
* Launch : October 2009
* Version : 1.3
* Released: May 9th, 2011
*
*
* all CSS sizing (width,height) is done in pixels (px)
*/
/* @group Reset */
.fht-table,
.fht-table thead,
.fht-table tfoot,
.fht-table tbody,
.fht-table tr,
.fht-table th,
.fht-table td {
/* position */
margin: 0;
/* size */
padding: 0;
/* text */
font-size: 100%;
font: inherit;
vertical-align: top;
}
.fht-table {
/* appearance */
border-collapse: collapse;
border-spacing: 0;
}
/* @end */
/* @group Content */
.fht-table-wrapper,
.fht-table-wrapper .fht-thead,
.fht-table-wrapper .fht-tfoot,
.fht-table-wrapper .fht-fixed-column .fht-tbody,
.fht-table-wrapper .fht-fixed-body .fht-tbody,
.fht-table-wrapper .fht-tbody {
/* appearance */
overflow: hidden;
/* position */
position: relative;
}
.fht-table-wrapper .fht-fixed-body .fht-tbody,
.fht-table-wrapper .fht-tbody {
/* appearance */
overflow: auto;
}
.fht-table-wrapper .fht-table .fht-cell {
/* appearance */
overflow: hidden;
/* size */
height: 1px;
}
.fht-table-wrapper .fht-fixed-column,
.fht-table-wrapper .fht-fixed-body {
/* position */
top: 0;
left: 0;
position: absolute;
}
.fht-table-wrapper .fht-fixed-column {
/* position */
z-index: 1;
}
/* @end */

758
inspiration/css/layout.css Normal file
View File

@@ -0,0 +1,758 @@
/* @override
http://dev.fixedheadertable.com/css/layout.css
*/
html,
body {
height: 100%;
}
h1 {
color: #FFF;
}
h2,h3,h4,h5 {
/* text */
color: #8b949f;
font-family: "prenton-1","prenton-2";
font-size: 14px;
font-weight: 500;
}
h2 {
/* size */
padding: 20px 0 0 0;
/* text */
color: #FFFFFF;
font-size: 26px;
font-weight: 700;
text-shadow: 0 2px 0px rgba(0,0,0,0.4);
}
h3 {
/* size */
padding: 20px 0 20px;
/* text */
color: #FFFFFF;
font-family: "prenton-1","prenton-2";
font-size: 24px;
font-weight: 700;
text-shadow: 0 2px 0px rgba(0,0,0,0.4);
}
p,
code {
/* text */
color: #2d3134;
font-size: 14px;
font-weight: 400;
line-height: 21px;
}
body {
/* appearance */
background-color: #98a0aa;
/* text */
font-family: "prenton-1","prenton-2";
}
.beta {
/* appearance */
background-color: #9999f3;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
/* position */
margin-left: 10px;
/* size */
padding: 5px;
/* text */
color: #FFF;
font-size: 12px;
}
/* @group Navigation */
nav {
/* appearance */
background-color: #8b949f;
background-image: url(../images/nav_texture.png);
border-bottom: 1px solid #5b636b;
/* position */
margin: 0 0 0 0;
position: relative;
/* text */
font-family: "prenton-1","prenton-2";
}
nav > .container_12 {
position: relative;
}
nav > ul,
#nav > ul {
/* appearance */
overflow: hidden;
/* position */
position: relative;
}
nav > ul > li,
#nav > ul > li {
/* position */
float: left;
/* size */
padding: 120px 10px 10px 10px;
/* text */
color: #2d3134;
font-size: 14px;
}
nav > ul > li > a.navButton,
#nav > ul > li > a.navButton {
/* appearance */
cursor: pointer;
border-left: 1px solid #98a0aa;
/* position */
display: inline-block;
padding: 2px 10px;
position: relative;
/* text */
color: #e1e5e9;
font-size: 24px;
font-weight: 200;
line-height: 18px;
text-decoration: none;
/* transition */
-moz-transition: border-color 0.2s linear, margin 0.2s linear, color 0.2s linear;
-webkit-transition: border-color 0.2s linear, margin 0.2s linear, color 0.2s linear;
-o-transition: border-color 0.2s linear, margin 0.2s linear, color 0.2s linear;
transition: border-color 0.2s linear, margin 0.2s linear, color 0.2s linear;
}
nav > ul > li > a.navButton span,
#nav > ul > li > a.navButton span {
/* text */
color: #2d3134;
font-size: 14px;
/* transition */
-moz-transition: color 0.2s linear;
-webkit-transition: color 0.2s linear;
-o-transition: color 0.2s linear;
transition: color 0.2s linear;
}
nav > ul > li a.navButton:hover,
#nav > ul > li a.navButton:hover {
color: #FFF;
border-left: 1px solid #4f5a65;
}
nav > ul > li a.navButton:hover span,
#nav > ul > li a.navButton:hover span {
color: #FFF;
}
nav > ul > li.first,
#nav > ul > li.first {
/* position */
margin-left: 80px;
}
nav .logo,
#nav .logo {
position: absolute;
padding: 0;
top: 40px;
right: 200px;
}
nav .logo h1,
#nav .logo h1 {
/* size */
padding: 0 0 4px 10px;
/* text */
font-size: 21px;
font-weight: 400;
text-shadow: 0 2px 0px rgba(0,0,0,0.4);
}
nav .logo h3,
#nav .logo h3 {
/* size */
padding: 0 0 0 10px;
/* text */
color: #2d3134;
font-size: 14px;
font-weight: normal;
line-height: 20px;
text-shadow: 0 1px 0px rgba(255,255,255,0.3);
}
#fixedNav {
/* appearance */
-webkit-box-shadow: 0 1px 0 #FFF, 0 3px 0 #b2b9c1, 0 15px 25px #b2b9c1;
-moz-box-shadow: 0 1px 0 #FFF, 0 3px 0 #b2b9c1, 0 15px 25px #b2b9c1;
box-shadow: 0 1px 0 #FFF, 0 3px 0 #b2b9c1, 0 15px 25px #b2b9c1;
/* position */
position: fixed;
top: -110px;
z-index: 10;
width: 100%;
}
#fixedNav nav {
/* appearance */
-webkit-box-shadow: 0 0 0 rgba(0,0,0,0) inset;
-moz-box-shadow: 0 0 0 rgba(0,0,0,0) inset;
box-shadow: 0 0 0 rgba(0,0,0,0) inset;
/* transition */
-webkit-transition: -webkit-box-shadow 0.5s linear;
-moz-transition: -moz-box-shadow 0.5s linear;
transition: box-shadow 0.5s linear;
}
#fixedNav nav.fixed {
/* appearance */
-webkit-box-shadow: 0 -5px 10px rgba(0,0,0,0.15) inset;
-moz-box-shadow: 0 -5px 10px rgba(0,0,0,0.15) inset;
box-shadow: 0 -5px 10px rgba(0,0,0,0.15) inset;
}
/* @end */
/* @group Button */
a.button {
/* appearance */
background-color: #6495ed;
background-image: -moz-linear-gradient(
top,
rgba(255,255,255,0) 100%,
rgba(255,255,255,0) 51%,
rgba(255,255,255,0.8) 50%,
rgba(255,255,255,0.2) 0%), url(../images/button_texture.png);
background-image: -webkit-gradient(
linear, left top, left bottom,
color-stop(100%,rgba(255,255,255,0)),
color-stop(51%,rgba(255,255,255,0.1)),
color-stop(50%,rgba(255,255,255,0.2)),
color-stop(0%,rgba(255,255,255,0))), url(../images/button_texture.png);
border: 1px solid #42629d;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
-webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.2), 0 1px 0 rgba(255,255,255,0.5) inset;
-moz-box-shadow: 0 2px 0 rgba(0,0,0,0.2), 0 1px 0 rgba(255,255,255,0.5) inset;
box-shadow: 0 2px 0 rgba(0,0,0,0.2), 0 1px 0 rgba(255,255,255,0.5) inset;
/* position */
display: inline-block;
margin: 6px 5px 10px 0;
/* size */
padding: 0 10px;
/* text */
color: #FFFFFF;
font-size: 14px;
line-height: 30px;
text-decoration: none;
text-shadow: 0 -1px 0 rgba(0,0,0,1);
-webkit-transition: background-color 0.2s linear, -webkit-box-shadow 0.2s linear, text-shadow, 0.2s linear;
-moz-transition: background-color 0.2s linear, -moz-box-shadow 0.2s linear, text-shadow 0.2s linear;
transition: background-color 0.2s linear, box-shadow 0.2s linear, text-shadow, 0.2s linear;
}
a.button:hover {
/* appearance */
background-color: #557fc9;
-webkit-box-shadow: 0 1px 0 #b3cbf6, 0 1px 0 rgba(0,0,0,0.2) inset;
-moz-box-shadow: 0 1px 0 #b3cbf6, 0 1px 0 rgba(0,0,0,0.2) inset;
box-shadow: 0 1px 0 #b3cbf6, 0 1px 0 rgba(0,0,0,0.2) inset;
/* text */
color: #fff;
text-shadow: 0 1px 0 rgba(0,0,0,1);
}
a.button:active {
background-color: #3c4147;
border-color: #0e0f10;
-webkit-box-shadow: 0 1px 0 #e1e5e9, 0 1px 0 rgba(0,0,0,0.2) inset;
-moz-box-shadow: 0 1px 0 #e1e5e9, 0 1px 0 rgba(0,0,0,0.2) inset;
box-shadow: 0 1px 0 #e1e5e9, 0 1px 0 rgba(0,0,0,0.2) inset;
}
/* @end */
section {
/* appearance */
background-color: #b2b9c1;
/*background-image: url(../images/nav_texture.png);*/
border-top: 1px solid #e1e5e9;
border-bottom: 1px solid #5b636b;
/* position */
margin: 0 0 -210px;
position: relative;
/* size */
min-height: 100%;
padding: 30px 0 0;
}
section#home pre {
/* appearance */
background-color: #8b949f;
border: 1px solid #5b636b;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
/* position */
margin: 0 50px;
/* size */
padding: 20px 20px;
}
section#home code {
/* appearance */
background-color: #FFFFFF;
/* position */
display: block;
/* size */
padding: 20px;
/* text */
font-size: 11px;
}
section#demo,
section#docs {
/* position */
margin: 0 0 -100px;
}
section#demo {
/* appearance */
background-color: #a5acb5;
}
section#docs {
/* appearance */
background-color: #b2b9c1;
}
section#docs ul {
/* appearance */
background-color: #a8b0b8;
border: 1px solid #8b949f;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
/* size */
padding: 20px;
}
section#docs ul li {
/* appearance */
background-color: #FFFFFF;
border-bottom: 1px solid #9aa2ac;
border-top: 1px solid #FFF;
/* size */
padding: 10px 20px;
}
section#docs ul li.odd {
background-color: #e1e5e9;
}
section#docs h4 {
/* size */
padding: 10px 0 0;
/* text */
color: #6495ed;
font-size: 18px;
font-weight: 300;
}
section#docs h5 {
/* size */
padding: 10px 0 0;
/* text */
color: #3c4147;
font-size: 12px;
font-weight: 400;
}
section#docs p {
padding: 10px;
}
section#docs pre code {
/* size */
padding: 10px 0 0;
/* text */
font-size: 12px;
}
section#docs pre code .key {
/* text */
color: #6495ed;
}
section#docs pre code .value {
/* text */
color: #6495ed;
}
section h2 {
/* size */
padding: 0px 0 30px;
}
section article.first {
border-right: 1px dashed #fff;
}
section article > p {
/* size */
padding: 10px 20px;
}
section#demo p {
/* size */
padding: 0 0 10px 0;
}
section div.tableForm {
/* appearance */
background-color: #98a0aa;
border: 1px solid #5b636b;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.06) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
/* position */
height: 50px;
position: relative;
/* size */
padding: 10px 0;
}
section div.tableForm fieldset {
/* position */
float: left;
/* size */
padding: 7px 10px;
}
section div.tableForm fieldset input {
/* appearance */
background-color: #e1e5e9;
border: 1px solid #737c85;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
/* size */
padding: 5px;
width: 50px;
/* text */
font-size: 18px;
}
section div.tableForm fieldset label {
/* size */
padding: 0 5px 0 0;
/* text */
color: #2d3134;
font-size: 14px;
}
section div.tableForm a.button {
/* position */
float: right;
/* size */
margin: 10px 20px;
}
section div.tableForm fieldset.switch label {
line-height: 40px;
float: left;
margin: 0 5px 0 10px;
}
section div.tableForm a.switch {
/* appearance */
background: #5b636b;
border: 1px solid #737c85;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
overflow: hidden;
/* position */
display: inline-block;
position: relative;
float: left;
margin: 3px 0 0;
/* size */
width: 60px;
height: 30px;
/* text */
text-decoration: none;
}
section div.tableForm a.switch span.switchButton {
/* background */
background-color: #e1e5e9;
background-image: -moz-linear-gradient(
top,
rgba(255,255,255,0) 100%,
rgba(255,255,255,0) 51%,
rgba(255,255,255,0.8) 50%,
rgba(255,255,255,0.2) 0%), url(../images/table_texture.png);
background-image: -webkit-gradient(
linear, left top, left bottom,
color-stop(100%,rgba(255,255,255,0)),
color-stop(51%,rgba(255,255,255,0.1)),
color-stop(50%,rgba(255,255,255,0.5)),
color-stop(0%,rgba(255,255,255,0))), url(../images/table_texture.png);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 0 4px #8b949f inset;
cursor: pointer;
/* position */
display: inline-block;
float: left;
position: absolute;
left: 30px;
z-index: 1;
/* size */
height: 30px;
width: 30px;
}
section div.tableForm a.switch span.switchOn,
section div.tableForm a.switch span.switchOff {
/* position */
display: inline-block;
position: absolute;
top: 0;
height: 30px;
line-height: 30px;
/* text */
color: #FFF;
font-size: 12px;
}
section div.tableForm a.switch span.switchOff {
/* position */
right: 5px;
/* text */
color: #8b949f;
text-shadow: 0 -2px 0 rgba(0,0,0,0.3);
}
section div.tableForm a.switch span.switchOn {
/* appearance */
background-color: #6495ed;
-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
box-shadow: 0 1px 0 rgba(255,255,255,0.5), 0 2px 4px rgba(0,0,0,0.3) inset;
/* position */
left: 0;
/* size */
padding: 0 0 0 5px;
width: 35px;
/* text */
text-shadow: 0 -2px 0 rgba(0,0,0,0.3);
}
section .divider {
padding: 20px 0;
}
section .clearSection {
height: 100px;
clear: both;
}
section#home .clearSection {
height: 210px;
}
footer#footer {
/* appearance */
background: #e5e7ea;
border-top: 1px solid #e1e5e9;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.06) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
/* position */
margin: 50px 0 0;
position: relative;
/* size */
height: 120px;
padding: 20px 0;
}
footer#footer .footnote {
font-size: 11px;
text-align: left;
}
div#tableBlock {
/* appearance */
background-color: #98a0aa;
border: 1px solid #5b636b;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.06) inset;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
box-shadow: 0 1px 0 rgba(255,255,255,1), 0 3px 0 rgba(0,0,0,0.05) inset;
/* position */
margin-bottom: 30px;
/* size */
padding: 10px;
}
.textAlignCenter {
/* text */
text-align: center;
}
#tableBlock th {
min-width: 100px;
}
#tableBlock td a {
/* text */
text-decoration: none;
white-space: nowrap;
}
#tableBlock td a.button {
/* appearance */
background-color: #cdd1d6;
background-image: -moz-linear-gradient(
top,
rgba(255,255,255,0) 100%,
rgba(255,255,255,0) 51%,
rgba(255,255,255,0.8) 50%,
rgba(255,255,255,0.2) 0%), url(../images/table_texture.png);
background-image: -webkit-gradient(
linear, left top, left bottom,
color-stop(100%,rgba(255,255,255,0)),
color-stop(51%,rgba(255,255,255,0.1)),
color-stop(50%,rgba(255,255,255,0.2)),
color-stop(0%,rgba(255,255,255,0))), url(../images/table_texture.png);
border-color: #737c85;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
/* position */
margin: 0;
/* text */
color: #2d3134;
font-size: 12px;
text-shadow: 0 1px 0 rgba(255,255,255,0.5);
}
#tableBlock td a.button:hover {
/* appearance */
background-color: #b6bbc1;
-webkit-box-shadow: 0 1px 0 #FFF, 0 1px 0 rgba(0,0,0,0.2) inset;
-moz-box-shadow: 0 1px 0 #FFF, 0 1px 0 rgba(0,0,0,0.2) inset;
box-shadow: 0 1px 0 #FFF, 0 1px 0 rgba(0,0,0,0.2) inset;
}
#tableBlock td p {
/* size */
padding: 0 0 10px;
/* text */
font-size: 12px;
font-weight: 400;
line-height: 16px;
}
.fancyTable th,
.fancyTable td {
/* appearance */
border: 1px solid #798088;
/* size */
padding: 10px;
}
.fancyTable thead tr th,
.fancyTable tfoot tr td {
/* appearance */
background-color: #abb3bb;
background-image: -moz-linear-gradient(
top,
rgba(255,255,255,0) 100%,
rgba(255,255,255,0) 51%,
rgba(255,255,255,0.8) 50%,
rgba(255,255,255,0.2) 0%), url(../images/table_texture.png);
background-image: -webkit-gradient(
linear, left top, left bottom,
color-stop(100%,rgba(255,255,255,0)),
color-stop(51%,rgba(255,255,255,0.1)),
color-stop(50%,rgba(255,255,255,0.2)),
color-stop(0%,rgba(255,255,255,0))), url(../images/table_texture.png);
-webkit-box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
-moz-box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
/* text */
color: #FFF;
text-align: left;
text-shadow: 0 -1px 0 rgba(0,0,0,0.5);
vertical-align: middle;
}
.fancyTable tbody tr td {
/* appearance */
background-color: #e1e5e9;
border-color: #9aa2ac;
-webkit-box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
-moz-box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
box-shadow: -1px 1px 0px rgba(255,255,255,0.5) inset;
/* text */
color: #2d3134;
font-size: 12px;
font-weight: 400;
}
.fancyTable tbody tr.odd td {
/* appearance */
background-color: #FFF;
}

160
inspiration/index.html Normal file
View File

@@ -0,0 +1,160 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Insert title here</title>
<link rel="stylesheet" href="css/defaultTheme.css"/>
<link rel="stylesheet" href="css/layout.css"/>
</head>
<body>
<div id="tableBlock">
<table class="myTable">
<thead>
<tr>
<th>Browser</th>
<th>Visits</th>
<th>Pages/Visit</th>
<th>Avg. Time on Site</th>
<th>% New Visits</th>
<th>Bounce Rate</th>
</tr>
</thead>
<tbody>
<tr>
<td>Firefox 1</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 2</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 3</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 4</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 5</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 6</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 7</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 8</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 9</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 10</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 11</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 12</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 13</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 14</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
<tr>
<td>Firefox 15</td>
<td class="numeric">1,990</td>
<td class="numeric">3.11</td>
<td class="numeric">00:04:22</td>
<td class="numeric">70.00%</td>
<td class="numeric">32.61%</td>
</tr>
</tbody>
</table>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.scrollFixedTable.js"></script>
<script type="text/javascript">
document.addEventListener('touchmove', function(e) {
e.preventDefault();
}, false);
$(function() {
var table = $('#tableBlock > table.myTable').scrollFixedTable({height: '300', altClass: 'odd', themeClass: 'fancyTable'});
// tableScroll = new Scroll(table.get(0));
});
</script>
</body>
</html>

1161
inspiration/js/jquery.scrollFixedTable.js Normal file
View File

File diff suppressed because it is too large Load Diff