473,385 Members | 1,958 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,385 software developers and data experts.

code for freezing html header

7
hello,
i am sending whole javascript code(it is for freezing html header)
it works fine eith IE but not firefox scroll bar does not come

Expand|Select|Wrap|Line Numbers
  1. var divContent = null;
  2. var divHeaderRow = null;
  3. var divHeaderColumn = null;
  4. var divHeaderRowColumn = null;
  5. var headerRowFirstColumn = null;
  6. var x;
  7. var y;
  8. var horizontal = false;
  9. var vertical = false;
  10. var browsername = null;
  11. // Copy table to top and to left
  12. function CreateScrollHeader(content, scrollHorizontal, scrollVertical)
  13. {
  14.     browsername = navigator.appName;
  15.     horizontal = scrollHorizontal;
  16.     vertical = scrollVertical;
  17.  
  18.     if (content != null)
  19.     {
  20.         divContent = content;
  21.         if (browsername == 'Netscape')
  22.         {
  23.             var headerRow = divContent.childNodes[1].childNodes[1].childNodes[1];
  24.             var headersecondrow =divContent.childNodes[1].childNodes[1].childNodes[2];
  25.             x = divContent.childNodes[1].offsetWidth;
  26.             y = divContent.childNodes[1].offsetHeight;
  27.         }
  28.         else
  29.         {
  30.             var headerRow = divContent.childNodes[0].childNodes[0].childNodes[0];
  31.             var headersecondrow =divContent.childNodes[0].childNodes[0].childNodes[1];
  32.             x = divContent.childNodes[0].offsetWidth;
  33.             y = divContent.childNodes[0].offsetHeight;        
  34.         }
  35.         divHeaderRow = divContent.cloneNode(true);        
  36.         if (horizontal)
  37.         {
  38.             divHeaderRow.style.height = headerRow.offsetHeight + headersecondrow.offsetHeight;
  39.             divHeaderRow.style.overflow = "hidden";
  40.  
  41.             divContent.parentNode.insertBefore(divHeaderRow, divContent);
  42.             if (browsername == 'Netscape')
  43.             {
  44.             divContent.childNodes[1].style.position = "absolute";
  45.             divContent.childNodes[1].style.top = "-" + (headerRow.offsetHeight + headersecondrow.offsetHeight) ;
  46.  
  47.             }
  48.             else
  49.             {
  50.             divContent.childNodes[0].style.position = "absolute";
  51.             divContent.childNodes[0].style.top = "-" + (headerRow.offsetHeight + headersecondrow.offsetHeight) ;
  52.             }
  53.             y = y - headerRow.offsetHeight;
  54.         }
  55.  
  56.         divHeaderRowColumn = divHeaderRow.cloneNode(true);    
  57.             if (browsername == 'Netscape')
  58.             {
  59.                     headerRowFirstColumn = headerRow.childNodes[1];
  60.             }
  61.             else
  62.             {
  63.                 headerRowFirstColumn = headerRow.childNodes[0];
  64.             }
  65.         divHeaderColumn = divContent.cloneNode(true);
  66.         divContent.style.position = "relative";
  67.  
  68.         if (vertical)
  69.         {
  70.             divContent.parentNode.insertBefore(divHeaderColumn, divContent);
  71.             divContent.style.left = headerRowFirstColumn.offsetWidth;
  72.             if (browsername == 'Netscape')
  73.             {
  74.             divContent.childNodes[1].style.position = "absolute";
  75.             divContent.childNodes[1].style.left = "-" + headerRowFirstColumn.offsetWidth;
  76.             }
  77.             else
  78.             {
  79.             divContent.childNodes[0].style.position = "absolute";
  80.             divContent.childNodes[0].style.left = "-" + headerRowFirstColumn.offsetWidth;
  81.             }
  82.         }
  83.         else
  84.         {
  85.             divContent.style.left = 0;
  86.         }
  87.  
  88.         if (vertical)
  89.         {
  90.             divHeaderColumn.style.width = headerRowFirstColumn.offsetWidth;
  91.             divHeaderColumn.style.overflow = "hidden";
  92.             divHeaderColumn.style.zIndex = "99";
  93.  
  94.             divHeaderColumn.style.position = "absolute";
  95.             divHeaderColumn.style.left = "0";
  96.             addScrollSynchronization(divHeaderColumn, divContent, "vertical");
  97.             x = x - headerRowFirstColumn.offsetWidth;
  98.         }
  99.  
  100.         if (horizontal)
  101.         {
  102.             if (vertical)
  103.             {
  104.                 divContent.parentNode.insertBefore(divHeaderRowColumn, divContent);
  105.             }
  106.             divHeaderRowColumn.style.position = "absolute";
  107.             divHeaderRowColumn.style.left = "0";
  108.             divHeaderRowColumn.style.top = "0";
  109.             divHeaderRowColumn.style.width = headerRowFirstColumn.offsetWidth;
  110.             divHeaderRowColumn.overflow = "hidden";
  111.             divHeaderRowColumn.style.zIndex = "100";
  112.             divHeaderRowColumn.style.backgroundColor = "#ffffff";
  113.  
  114.         }
  115.  
  116.         if (horizontal)
  117.         {
  118.             addScrollSynchronization(divHeaderRow, divContent, "horizontal");
  119.         }
  120.  
  121.         if (horizontal || vertical)
  122.         {
  123.             window.onresize = ResizeScrollArea;
  124.             ResizeScrollArea();
  125.         }
  126.     }
  127. }
  128.  
  129.  
  130. // Resize scroll area to window size.
  131. function ResizeScrollArea()
  132. {
  133.     var height = document.documentElement.clientHeight - 120;
  134.     if (!vertical)
  135.     {
  136.         height -= divHeaderRow.offsetHeight;
  137.     }
  138.     var width = document.documentElement.clientWidth - 50;
  139.     if (!horizontal)
  140.     {
  141.         width -= divHeaderColumn.offsetWidth;
  142.     }
  143.     var headerRowsWidth = 0;
  144.     if(browsername == 'Netscape')
  145.     {
  146.         divContent.childNodes[1].style.width = x;
  147.         divContent.childNodes[1].style.height = y;
  148.     }
  149.     else
  150.     {
  151.     divContent.childNodes[0].style.width = x;
  152.     divContent.childNodes[0].style.height = y;
  153.     }
  154.     if (divHeaderRowColumn != null)
  155.     {
  156.         headerRowsWidth = divHeaderRowColumn.offsetWidth;
  157.     }
  158.  
  159.     // width
  160.     if(browsername == 'Netscape')
  161.     {
  162.         if (divContent.childNodes[1].offsetWidth > width)
  163.         {
  164.             divContent.style.width = Math.max(width - headerRowsWidth, 0);
  165.             divContent.style.overflowX = "scroll";
  166.             divContent.style.overflowY = "auto";
  167.         }
  168.         else
  169.         {
  170.             divContent.style.width = x;
  171.             divContent.style.overflowX = "auto";
  172.             divContent.style.overflowY = "auto";
  173.         }
  174.     }
  175.     else
  176.     {
  177.         if (divContent.childNodes[0].offsetWidth > width)
  178.         {
  179.             divContent.style.width = Math.max(width - headerRowsWidth, 0);
  180.             divContent.style.overflowX = "scroll";
  181.             divContent.style.overflowY = "auto";
  182.         }
  183.         else
  184.         {
  185.             divContent.style.width = x;
  186.             divContent.style.overflowX = "auto";
  187.             divContent.style.overflowY = "auto";
  188.         }
  189.     }
  190.     if (divHeaderRow != null)
  191.     {
  192.         divHeaderRow.style.width = divContent.offsetWidth + headerRowsWidth;
  193.     }
  194.  
  195.     // height
  196.     if(browsername == 'Netscape')
  197.     {
  198.         if (divContent.childNodes[1].offsetHeight > height)
  199.         {
  200.             divContent.style.height = Math.max(height, 80);
  201.             divContent.style.overflowY = "scroll";
  202.         }
  203.         else
  204.         {
  205.             divContent.style.height = y;
  206.             divContent.style.overflowY = "hidden";
  207.         }
  208.      }
  209.      else
  210.      {
  211.         if (divContent.childNodes[0].offsetHeight > height)
  212.         {
  213.             divContent.style.height = Math.max(height, 80);
  214.             divContent.style.overflowY = "scroll";
  215.         }
  216.         else
  217.         {
  218.             divContent.style.height = y;
  219.             divContent.style.overflowY = "hidden";
  220.         }
  221.      }
  222.     if (divHeaderColumn != null)
  223.     {
  224.         divHeaderColumn.style.height = divContent.offsetHeight;
  225.     }
  226.  
  227.     // check scrollbars
  228.     if (divContent.style.overflowY == "scroll")
  229.     {
  230.         divContent.style.width = divContent.offsetWidth + 17;
  231.     }
  232.     if (divContent.style.overflowX == "scroll")
  233.     {
  234.         divContent.style.height = divContent.offsetHeight + 17;
  235.     }
  236.         if(browsername == 'Netscape')
  237.         {
  238.             divContent.parentNode.style.width = divContent.offsetWidth + headerRowsWidth;    
  239.         }
  240.         else
  241.         {
  242.             divContent.parentElement.style.width = divContent.offsetWidth + headerRowsWidth;
  243.         }
  244.  
  245. }
  246.  
  247. ********************************************************************************
  248. // Synchronize div elements when scrolling 
  249. // from http://webfx.eae.net/dhtml/syncscroll/syncscroll.html
  250. // ********************************************************************************
  251. // This is a function that returns a function that is used
  252. // in the event listener
  253. function getOnScrollFunction(oElement) {
  254.     return function () {
  255.         if (oElement._scrollSyncDirection == "horizontal" || oElement._scrollSyncDirection == "both")
  256.             oElement.scrollLeft = event.srcElement.scrollLeft;
  257.         if (oElement._scrollSyncDirection == "vertical" || oElement._scrollSyncDirection == "both")
  258.             oElement.scrollTop = event.srcElement.scrollTop;
  259.     };
  260.  
  261. }
  262.  
  263. // This function adds scroll syncronization for the fromElement to the toElement
  264. // this means that the fromElement will be updated when the toElement is scrolled
  265. function addScrollSynchronization(fromElement, toElement, direction) {
  266.     removeScrollSynchronization(fromElement);
  267.  
  268.     fromElement._syncScroll = getOnScrollFunction(fromElement);
  269.     fromElement._scrollSyncDirection = direction;
  270.     fromElement._syncTo = toElement;
  271.     if(browsername != 'Netscape')
  272.         {
  273.             toElement.attachEvent("onscroll", fromElement._syncScroll);
  274.         }
  275.     else
  276.         {
  277.             toElement.addEventListener("scroll", fromElement._syncScroll,true);
  278.         }
  279. }
  280.  
  281. // removes the scroll synchronization for an element
  282.     function removeScrollSynchronization(fromElement) {
  283.     if (fromElement._syncTo != null)
  284.         if(browsername != 'Netscape')
  285.         {
  286.             fromElement._syncTo.detachEvent("onscroll", fromElement._syncScroll);
  287.         }
  288.         else
  289.         {
  290.             fromElement._syncTo.removeEventListener("scroll", fromElement._syncScroll,true);
  291.         }
  292.  
  293.     fromElement._syncTo = null;
  294.     fromElement._syncScroll = null;
  295.     fromElement._scrollSyncDirection = null;
  296. }
  297.  
Thanks
Sep 5 '07 #1
3 2707
gits
5,390 Expert Mod 4TB
hi ...

please use the code tags when posting code ... this is the last friendly note about that ... it helps the users to better read your code and it is a posting rule ... that all members has to follow ... read:

How to Ask a Question

kind regards
Sep 5 '07 #2
dmjpro
2,476 2GB
Look, I told to see that solution.
I think you didn't see it.

Anyway, it will be.
Expand|Select|Wrap|Line Numbers
  1. style.width="50px"; //Not = 50 or -50 or something like that.
  2. //this is valid.
  3.  
Now try it and see what happens.
Good luck.

Kind regards,
Dmjpro.
Sep 5 '07 #3
acoder
16,027 Expert Mod 8TB
Don't use browser detection. You're checking for "Netscape" and basing your code on that. Use object detection instead, e.g.
Expand|Select|Wrap|Line Numbers
  1. if (obj.addEventListener) {
See this link.
Sep 5 '07 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

7
by: David. E. Goble | last post by:
Hi all; I have the following files; index.html, sigsheader.js, sigsboby.js, smilesbody.js and smiles.js. The sourse is below. The page displays two manual slide shows... Each slideshow has a set...
9
by: David. E. Goble | last post by:
Arrrh! some buttons work while others don't, but I can't see why. I have tried comparing the files that do work, with the ones that don't. But to no help. The funny thing is the parts that work...
4
by: Matt | last post by:
I have a web page that reads a dataset, populates a datagrid, and then launches Excel to display the results. I was able to format the results (font, background color ..) and even create a filter...
17
by: tshad | last post by:
Many (if not most) have said that code-behind is best if working in teams - which does seem logical. How do you deal with the flow of the work? I have someone who is good at designing, but...
6
by: Steven K | last post by:
Hello, I am having a problem where my computer is freezing when I run a ASP.net project. It freezes in the debugger, or if I try to run it as localhost. I cannot even access the windows...
10
by: MaRCeLO PeReiRA | last post by:
Hi All, After PostgreSQL freeze some times, I am moving from 7.3.4 to 7.4.1, trying to solve this problem. When the daemon get frozen, I can't even use psql to browse a database (as if the...
2
by: Job Lot | last post by:
Is there any way of freezing columns in Windows Forms Data Grid control? Thanks
7
by: bearophileHUGS | last post by:
Most of my ideas seem usless or stupid, but I think expressing them here doesn't harm much. This is an idea for Py 3.0, because it's not backward compatible. Dicts and sets require immutable...
3
by: asearle | last post by:
Hi everyone, I currently display XML data with XSLT which works fine (including some dynamic filtering with JavaScript). However, often the data which is returned is quite lengthy and, as the...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.