User:Amit6/my sortable table pimary 04.xhtml.css

  a {text-decoration:none;color:#002bb8;background:none} a:visited {color:#5a3696} a:link {color:#002bb8} a:active {color:#faa700} a:hover {text-decoration:underline} p {font-size:110%} body[dir="rtl"] #UI_goUp {float:right} body[dir="rtl"] #UI_showHidden {float:left} table {clear:both;width:90%;margin:0 auto} tbody >tr:hover {background-color:#eeeeee} td:not(:first-child) {width:0} .dir::before {content:url(chrome://global/skin/dirListing/folder.png)} <![CDATA[ table[order] >thead >tr >th {cursor:pointer} table[order] >thead >tr >th::after {display:none;width:.8em;-moz-margin-end:-.8em;text-align:end} table[order="asc"] >thead >tr >th::after {content:"\25B2"} table[order="desc"] >thead >tr >th::after {content:"\25BC"} table[order][order-by="0"] >thead >tr >th:first-child >a,table[order][order-by="1"] >thead >tr >th:first-child + th >a,table[order][order-by="2"] >thead >tr >th:first-child + th + th >a {text-decoration:underline} table[order][order-by="0"] >thead >tr >th:first-child::after,table[order][order-by="1"] >thead >tr >th:first-child + th::after,table[order][order-by="2"] >thead >tr >th:first-child + th + th::after {display:inline-block} td:first-child + td + td {-moz-padding-start:1em;-moz-padding-end:.5em;white-space:nowrap} td:last-child {-moz-padding-start:.5em;white-space:nowrap} @-moz-document url-prefix(gopher://) { td {white-space:pre !important;font-family:monospace} table {direction:ltr} } .symlink {font-style:italic} .dir,.symlink,.file {-moz-margin-start:20px} .dir::before,.file >img {-moz-margin-end:4px;-moz-margin-start:-20px;vertical-align:middle} .dir::before {content:url(resource://gre/res/html/folder.png)} ]]> <![CDATA[ var gTable, gOrderBy, gTBody, gRows, gUI_showHidden; document.addEventListener("DOMContentLoaded", function { gTable = document.getElementsByTagName("table")[0]; gTBody = gTable.tBodies[0]; if (gTBody.rows.length< 2) return; gUI_showHidden = document.getElementById("UI_showHidden"); var headCells = gTable.tHead.rows[0].cells, hiddenObjects = false; function rowAction(i) { return function(event) { event.preventDefault; orderBy(i); } } for (var i = headCells.length - 1;i >= 0;i--) { var anchor = document.createElement("a"); anchor.href = ""; anchor.appendChild(headCells[i].firstChild); headCells[i].appendChild(anchor); headCells[i].addEventListener("click", rowAction(i), true); } if (gUI_showHidden) { gRows = Array.slice(gTBody.rows); hiddenObjects = gRows.some(function (row) row.className == "hidden-object"); } gTable.setAttribute("order", ""); if (hiddenObjects) { gUI_showHidden.style.display = "block"; updateHidden; } }, "false"); function compareRows(rowA, rowB) { var a = rowA.cells[gOrderBy].getAttribute("sortable-data") || ""; var b = rowB.cells[gOrderBy].getAttribute("sortable-data") || ""; var intA = +a; var intB = +b; if (a == intA && b == intB) { a = intA; b = intB; } else { a = a.toLowerCase; b = b.toLowerCase; } if (a< b) return -1; if (a >b) return 1; return 0; } function orderBy(column) { if (!gRows) gRows = Array.slice(gTBody.rows); var order; if (gOrderBy == column) { order = gTable.getAttribute("order") == "asc" ? "desc" :"asc"; } else { order = "asc"; gOrderBy = column; gTable.setAttribute("order-by", column); gRows.sort(compareRows); } gTable.removeChild(gTBody); gTable.setAttribute("order", order); if (order == "asc") for (var i = 0;i< gRows.length;i++) gTBody.appendChild(gRows[i]); else for (var i = gRows.length - 1;i >= 0;i--) gTBody.appendChild(gRows[i]); gTable.appendChild(gTBody); } function updateHidden { gTable.className = gUI_showHidden.getElementsByTagName("input")[0].checked ? "" : "remove-hidden"; } ]]>  Sortable Table 04.xhtml  document.write(''); Index of file:///D:/AMIT/SVG Inkscape
 * 1) UI_goUp {margin-top:0;float:left}
 * 1) UI_showHidden {margin-top:0;float:right}