Les agradezco mucho que me contestarán.
Espero que me sepa explicar.
La función en javascript hace que lo que esta dentro del div que mando lo muestre en una tabla con barras de desplazamiento propias.
esta es la función:
<script>
var divContent = null;
var divHeaderRow = null;
var divHeaderColumn = null;
var divHeaderRowColumn = null;
var headerRowFirstColumn = null;
var x;
var y;
var z;
var horizontal = false;
var vertical = false;
var height;
function CreateScrollHeader(content, scrollHorizontal, scrollVertical, numElem)
{
horizontal = scrollHorizontal;
vertical = scrollVertical;
if (content != null)
{
divContent = content;
var headerRow = divContent.childNodes[0].childNodes[0].childNodes[0];
x = divContent.childNodes[0].offsetWidth;
y = divContent.childNodes[0].offsetHeight;
divHeaderRow = divContent.cloneNode(true);
z = x;
if (horizontal)
{
divHeaderRow.style.height = headerRow.offsetHeight;
divHeaderRow.style.overflow = "hidden";
divContent.parentNode.insertBefore(divHeaderRow, divContent);
divContent.childNodes[0].style.position = "relative";
divContent.childNodes[0].style.top = "-" + headerRow.offsetHeight;
y = y - headerRow.offsetHeight;
}
divHeaderRowColumn = divHeaderRow.cloneNode(true);
headerRowFirstColumn = headerRow.childNodes[0];
divHeaderColumn = divContent.cloneNode(true);
divContent.style.position = "relative";
if (vertical)
{
divContent.parentNode.insertBefore(divHeaderColumn , divContent);
divContent.style.left = headerRowFirstColumn.offsetWidth;
divContent.childNodes[0].style.position = "absolute";
divContent.childNodes[0].style.left = "-" + headerRowFirstColumn.offsetWidth;
}
else
{
divContent.style.left = 0;
}
if (vertical)
{
divHeaderColumn.style.width = headerRowFirstColumn.offsetWidth;
divHeaderColumn.style.overflow = "hidden";
divHeaderColumn.style.zIndex = "99";
divHeaderColumn.style.position = "absolute";
divHeaderColumn.style.left = "0";
addScrollSynchronization(divHeaderColumn, divContent, "vertical");
x = x - headerRowFirstColumn.offsetWidth;
}
if (horizontal)
{
if (vertical)
{
divContent.parentNode.insertBefore(divHeaderRowCol umn, divContent);
}
divHeaderRowColumn.style.position = "absolute";
divHeaderRowColumn.style.left = "0";
divHeaderRowColumn.style.top = "0";
divHeaderRowColumn.style.width = headerRowFirstColumn.offsetWidth ;
divHeaderRowColumn.overflow = "hidden";
divHeaderRowColumn.style.zIndex = "100";
divHeaderRowColumn.style.backgroundColor = "#ffffff";
}
if (horizontal)
{
addScrollSynchronization(divHeaderRow, divContent, "horizontal");
}
if (horizontal || vertical)
{
window.onresize = ResizeScrollArea;
ResizeScrollArea(numElem);
if (y >= document.documentElement.clientHeight)
{
document.getElementById("pie").style.top = height + headerRow.offsetHeight;
document.getElementById("pie2").style.top = height + headerRow.offsetHeight;
document.getElementById("pie2").style.left = - 7;
document.getElementById("pie2").style.widht = x - 35;
}
else
{
if (numElem >= 17)
{
document.getElementById("pie").style.top = height + headerRow.offsetHeight;
document.getElementById("pie2").style.top = height + headerRow.offsetHeight;
}
else
{
document.getElementById("pie").style.top = y + headerRow.offsetHeight;
document.getElementById("pie2").style.top = y + headerRow.offsetHeight;
}
document.getElementById("pie2").style.left = - 7;
document.getElementById("pie2").style.widht = x - 35;
}
}
else
{
document.getElementById("pie").style.top=y;
document.getElementById("pie2").style.top=y;
document.getElementById("pie2").style.left=-7;
document.getElementById("pie2").style.widht=x-35;
}
}
}
function ResizeScrollArea(nElem)
{
if (nElem >=17) {
height = document.documentElement.clientHeight - 270;
}
else
{
height = document.documentElement.clientHeight;
}
if (!vertical)
{
height -= divHeaderRow.offsetHeight;
}
var width = document.documentElement.clientWidth - 50;
if (!horizontal)
{
width -= divHeaderColumn.offsetWidth;
}
var headerRowsWidth = 0;
divContent.childNodes[0].style.width = x;
divContent.childNodes[0].style.height = y;
if (divHeaderRowColumn != null)
{
headerRowsWidth = divHeaderRowColumn.offsetWidth;
}
if (divContent.childNodes[0].offsetWidth > width)
{
divContent.style.width = Math.max(width - headerRowsWidth, 0);
divContent.style.overflowX = "scroll";
divContent.style.overflowY = "auto";
}
else
{
divContent.style.width = x;
divContent.style.overflowX = "auto";
divContent.style.overflowY = "auto";
}
if (divHeaderRow != null)
{
divHeaderRow.style.width = divContent.offsetWidth + headerRowsWidth;
}
if (divContent.childNodes[0].offsetHeight > height)
{
divContent.style.height = Math.max(height, 80);
divContent.style.overflowY = "scroll";
}
else
{
divContent.style.height = y;
divContent.style.overflowY = "hidden";
}
if (divHeaderColumn != null)
{
divHeaderColumn.style.height = divContent.offsetHeight;
}
if (divContent.style.overflowY == "scroll")
{
divContent.style.width = divContent.offsetWidth + 17;
}
if (divContent.style.overflowX == "scroll")
{
divContent.style.height = divContent.offsetHeight + 17;
}
divContent.parentElement.style.width = divContent.offsetWidth + headerRowsWidth;
}
function getOnScrollFunction(oElement) {
return function () {
if (oElement._scrollSyncDirection == "horizontal" || oElement._scrollSyncDirection == "both")
oElement.scrollLeft = event.srcElement.scrollLeft;
if (oElement._scrollSyncDirection == "vertical" || oElement._scrollSyncDirection == "both")
oElement.scrollTop = event.srcElement.scrollTop;
};
}
function addScrollSynchronization(fromElement, toElement, direction) {
removeScrollSynchronization(fromElement);
fromElement._syncScroll = getOnScrollFunction(fromElement);
fromElement._scrollSyncDirection = direction;
fromElement._syncTo = toElement;
toElement.attachEvent("onscroll", fromElement._syncScroll);
}
function removeScrollSynchronization(fromElement) {
if (fromElement._syncTo != null)
fromElement._syncTo.detachEvent("onscroll", fromElement._syncScroll);
fromElement._syncTo = null;
fromElement._syncScroll = null;
fromElement._scrollSyncDirection = null;
}
</script>
Gracias nuevamente
Saludos
