1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177
| <style type="text/css">
.Issue
{
font-family:Arial;
font-size:12;
font-weight:bold;
width: 400px;
}
</style>
<style type="text/css">
.WrapperDiv {
width:1170px;height:680px;
}
.WrapperDiv TH {
position:relative;
top: expression(offsetParent.scrollTop);
}
.WrapperDiv TR
{
/* Needed for IE */
height:0px;
}
.ScrollContent
{
/* Needed for Opera */
display: block;
overflow: auto;
width: 100%;
height: 250px;
}
.FixedHeader
{
/* Needed for opera */
display: block;
}
</style>
<script type="text/ecmascript">
var headerHeight = 8;
/// <summary>
/// Responsible for call appropriate function according to browser
/// for Browser Compatibility
/// </summary>
function onLoad() {
if (navigator.appName == "Opera") {
freezetableHeaderForOpera('tSummaryIc');
}
else {
FreezetableHeaderForIEAndFF('tSummaryIc', 'WrapperDiv');
}
}
function FreezetableHeaderForIEAndFF(tableID, wrapperDivCssClass)
{
var table = document.getElementById(tableID);
if (table != 'undefined')
{
table.style.visibility = 'hidden';
var div = null;
if (table.parentNode != 'undefined')
{
//Find wrapper div output by table
div = table.parentNode;
if (div.tagName == "DIV")
{
div.className = wrapperDivCssClass;
div.style.overflow = "auto";
}
}
var table = prepareFixedHeader(table);
var tbody = table.getElementsByTagName('TBODY')[0];
//Needed for Firefox
tbody.style.height = (div.offsetHeight - headerHeight) + 'px';
tbody.style.overflowX = "hidden";
tbody.overflow = 'auto';
tbody.overflowX = 'hidden';
table.style.visibility = 'visible';
}
}
/// <summary>
/// Used to prepare a fixed table header
/// </summary>
/// <param name="table" type="table">
/// The Reference Of table control
/// </param>
function prepareFixedHeader(table) {
//Find DOM TBODY element and and
var tags = table.getElementsByTagName('TBODY');
if (tags != 'undefined') {
var tbody = tags[0];
var trs = tbody.getElementsByTagName('TR');
if (trs != 'undefined') {
headerHeight += trs[0].offsetHeight;
//Remove first TR tag from it
var headTR = tbody.removeChild(trs[0]);
//create a new element called THEAD
var head = document.createElement('THEAD');
head.appendChild(headTR);
// head.position = 'fixed';
//add to a THEAD element instead of TR so CSS styles
//can be applied properly in both IE and FireFox
table.insertBefore(head, table.firstChild);
}
}
return table;
}
/// <summary>
/// Used to create a fixed table header and allow scrolling
/// for Opera (Tested in Opera-9.2)
/// </summary>
/// <param name="tableId" type="String">
/// Client-side ID of the table control
/// </param>
function freezetableHeaderForOpera(tableId) {
var table = document.getElementById(tableId);
if (table != 'undefined') {
table = prepareFixedHeader(table);
var headers = table.getElementsByTagName('THEAD')[0];
headers.className = "FixedHeader";
var tbody = table.getElementsByTagName('TBODY')[0];
tbody.className = "ScrollContent";
var cells = tbody.childNodes[0];
for (var i = 0; i < cells.childNodes.length; i++) {
var tableCell = cells.childNodes[i];
var tableCellWidth = getStyle(tableCell, 'width')
var headerCell = headers.childNodes[0].childNodes[i];
var headerCellWidth = getStyle(headerCell, 'width');
if (widthPxToInt(tableCellWidth) > widthPxToInt(headerCellWidth)) {
headerCell.style.width = (widthPxToInt(tableCellWidth) - 10) + "px";
}
else {
tableCell.style.width = (widthPxToInt(headerCellWidth) - 10) + "px";
}
}
}
}
function getStyle(oElm, strCssRule) {
var strValue = "";
if (document.defaultView && document.defaultView.getComputedStyle) {
strValue = document.defaultView.getComputedStyle(oElm,
"").getPropertyValue(strCssRule);
}
else if (oElm.currentStyle) {
strCssRule = strCssRule.replace(/\-(\w)/g, function(strMatch, p1) {
return p1.toUpperCase();
});
strValue = oElm.currentStyle[strCssRule];
}
return strValue;
}
/// <summary>
/// Used to convert from Pxel to Integer
/// </summary>
/// <param name="width" type="String">
/// Width of any thing like tableHeader,tableCell
/// </param>
function widthPxToInt(width) {
width = width.substr(0, width.length - 2);
return new Number(width);
}
</script> |
Partager