zhongjin
/
cartodb
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first column movement

Browse Source
1.0
Javier Álvarez Medina 14 years ago
parent 5409c079fd
commit a7a984aaab
3 changed files with 23 additions and 14 deletions
Show Stats Download Patch File Download Diff File

15
cDBtable/cDBtable.css
Unescape View File

@ -1,20 +1,25 @@
div.table_position table {position:relative; width:auto; margin:5px 0 0 0; padding:55px 0 0 0; background:white; table-layout:fixed;}
div.table_position table thead {position:absolute; top:0; left:0; padding:0; margin:0;}
div.table_position table thead {position:absolute; top:0; left:0; padding:0; margin:0; z-index:20;}
div.table_position table thead tr {border-bottom:1px solid #D2D3D5;}
div.table_position table thead tr th {background-color:#FFFFFF; background: -moz-linear-gradient(100% 100% 90deg, #FFFFFF, #DDDEE1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#DDDEE1));
border-right:1px solid #E2E3E7; text-shadow:0 1px white; -moz-box-shadow:inset 1px 1px 0 white; -webkit-box-shadow:inset 1px 1px 0 white;}
div.table_position table thead tr th div {position:relative!important; padding:13px; width:100px;}
div.table_position table thead tr th div.first {position:relative; width:40px; padding:0;}
div.table_position table thead tr th h3 {font:bold 11px "Helvetica"; color:#727272; text-align:left; text-shadow:0 1px white;}
div.table_position table thead tr th p {font:normal 11px "Helvetica"; color:#B4B4B4; text-align:left; text-shadow:0 1px white;}
div.table_position table thead tr th a {position:absolute; right:10px; top:10px; height:14px; width:14px; margin:0; background:url('/images/tables/head_option_bkg.png') no-repeat 0 0; text-indent:-9999px; z-index:100;}
div.table_position table thead tr th a:hover {background-position:0 -14px;}
div.table_position table tbody {float:left; padding:55px 0 0 0 ;}
div.table_position table tbody tr {height:39px;}
div.table_position table tbody tr td {height:13px!important; background-color:#f0f1f5; background:-moz-linear-gradient(100% 100% 90deg, #f9fafe, #f0f1f5); background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9fafe), to(#f0f1f5));
div.table_position table tbody {float:left; padding:53px 0 0 0 ;}
div.table_position table tbody tr {position:relative; float:left; height:39px; padding:0 0 0 40px;}
div.table_position table tbody tr td {padding:0; margin:0; background-color:#f0f1f5; background:-moz-linear-gradient(100% 100% 90deg, #f9fafe, #f0f1f5); background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#f9fafe), to(#f0f1f5));
border:1px solid #E4E5E9; border-left:none; border-top:none; font:normal 13px "Helvetica"; line-height:13px; color:#666666; text-shadow:0 1px white; -moz-box-shadow:inset 1px 1px 0 white; -webkit-box-shadow:inset 1px 1px 0 white;}
div.table_position table tbody tr td:hover {cursor:pointer;}
div.table_position table tbody tr:hover td {background: -moz-linear-gradient(100% 100% 90deg, #edf9ef, #e4F0E1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#edf9ef), to(#e4F0E1));}
div.table_position table tbody tr td div {width:100px; padding:13px; overflow:hidden; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-user-select:none; -moz-user-select:none;}
div.table_position table tbody tr td div {width:100px; height:14px; padding:13px; overflow:hidden; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; -webkit-user-select:none; -moz-user-select:none;}
div.table_position table tbody tr td.first {position:absolute; left:0; width:40px; height:40px; padding:0; margin:0; z-index:10;}
div.table_position table tbody tr td.first div {position:relative; width:40px; height:27px; padding:0!important; margin:0!important;}
div.table_position table tbody tr td.first div a {position:absolute; left:13px; top:13px; height:14px; width:14px; margin:0; background:url('/images/tables/head_option_bkg.png') no-repeat 0 0; text-indent:-9999px; z-index:100;}
div.table_position table tbody tr td.first div a:hover {background-position:0 -14px; cursor:pointer;}
div.table_position div.loading {position:relative; display:default; float:left; width:100%; height:45px; padding:45px 0 0; margin:1px 0 0 0; background: -moz-linear-gradient(100% 100% 90deg, #DCDDE0, #FEFEFE); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DCDDE0), to(#FEFEFE));}
div.table_position div.loading.loading_previous {margin:51px 0 0 0; border-bottom:1px solid #E4E5E9;}

20
cDBtable/cDBtable.js
Unescape View File

@ -28,8 +28,8 @@
defaults = {
getDataUrl: 'http://bioblitz.tdwg.org/api/taxonomy',
paginateParam: "page",
resultsPerPage: 20,
reuseResults: 40,
resultsPerPage: 50,
reuseResults: 500,
total: 5000
};
@ -80,7 +80,7 @@
//Draw the data
if ($(table).html()=='') {
var thead = '<thead><tr>';
var thead = '<thead><tr><th><div class="first"></div></th>';
$.each(data[0], function(index,element){
thead += '<th width="100"><div><h3>'+index+'</h3><p>String</p><a href="#">options</a></div></th>';
});
@ -107,7 +107,7 @@
//Loop all the data
$.each(data, function(i,element){
tbody += '<tr>';
tbody += '<tr><td class="first" r="'+((page*(defaults.resultsPerPage)) + i)+'"><div><a href="#">options</a></div></td>';
$.each(element, function(j,elem){
tbody += '<td width="100" r="'+((page*(defaults.resultsPerPage)) + i)+'" c="'+j+'"><div>'+elem+'</div></td>';
});
@ -164,7 +164,7 @@
ev.stopPropagation();
ev.preventDefault();
//For move thead when scrolling
//For moving thead when scrolling
if ($(window).scrollTop()>162) {
$(table).children('thead').css('top',$(window).scrollTop()-167+'px');
} else {
@ -172,6 +172,10 @@
}
//For moving first table column
$(table).children('tbody').children('tr').children('td.first').css('left',$(window).scrollLeft()+'px');
//For paginating data
if (!loading) {
var difference = $(document).height() - $(window).height();
@ -197,7 +201,7 @@
}
if (kind=="previous") {
$('div.loading_next p.count').text('Now vizzualizing '+range+' of '+defaults.total);
$('div.loading_previous p.count').text('Now vizzualizing '+range+' of '+defaults.total);
$(table).children('tbody').css('padding','0');
$('div.loading_previous').show();
} else {
@ -211,7 +215,7 @@
loading = false;
$('div.loading_next').hide();
$('div.loading_previous').hide();
$(table).children('tbody').css('padding','55px 0 0 0');
$(table).children('tbody').css('padding','53px 0 0 0');
},
@ -220,7 +224,7 @@
var target = event.target || event.srcElement;
var targetElement = target.nodeName.toLowerCase();
if (targetElement == "div") {
if (targetElement == "div" && $(target).parent().attr('r')!=undefined) {
alert($(target).parent().attr('c')+'-'+$(target).parent().attr('r')+'-'+$(target).parent().text());
}

2
stylesheets/table.css
Unescape View File

@ -37,7 +37,7 @@ section.subheader div.right span.paginate a.next {background:url('/images/icons/
section.subheader div.right span.paginate a:hover {background-position:0 -23px;}
/*TABLE*/
div.table_position {float:left; margin:0 0 0 40px; background:white;}
div.table_position {float:left; margin:0; background:white;}

Write Preview
Loading…
Cancel
Save