arpan_de
09-21-2005, 10:11 PM
I have an ASP page which retrieves 100 records from the database. All the 100 records are displayed in one page is a HTML table.
Now since all the 100 records are being displayed in one page, when a user scrolls down the page, the headers of the different columns no longer remain visible. In other words, to have a look at the column names, one has to again go to the top of the page. Since the column headers aren't visible as the page is scrolled down, users don't get to know to which column a particular record belongs to (there are 21 columns in total).
To overcome this, I have included a JavaScript code which ensures that when the page is scrolled down, the column headers also scroll down so that users can see to which column a record belongs to. Please note that these column headers should be visible only when the page is scrolled down. When the user is at the top of the page, there is already a static row of column headers which is the very first row in the HTML table. Please have a look at http://www17.brinkster.com/arpand/atlantic/job2/test.asp to get an idea of my problem.
As such, JavaScript has resolved my problem but there is a minor hitch. When you visit the above mentioned URL, you will find that the row of column headers (which should actually scroll down/up but shouldn't be displayed when the user is at the top of the page) can be seen as the page is loading. Once the page gets loaded completely, this row of column headers disappears & only when a user starts scrolling down, that row of column headers appears. I don't want that row of column headers to appear when the page is being loaded. It should only appear when users no longer can see the static column headers (first row of the HTML table).
That row of column headers is enclosed within <div id="headerfloat"></div> which in turn is in another HTML table whose id="ln". To ensure that that row of column headers doesn't appear when the page is loading, I added the following function in the body's onLoad event:
<script language="JavaScript">
function hideDiv(){
headerfloat.style.visibility="hidden"
ln.style.visibility="hidden"}
</script>
<body onLoad="hideDiv()">
but this doesn't do the needful.
How do I ensure that when the page is loading, that row of column headers (which should scroll down/up but shouldn't be displayed when the user is at the top of the page) remains hidden/invisible to the user?
Thanks,
Arpan
Now since all the 100 records are being displayed in one page, when a user scrolls down the page, the headers of the different columns no longer remain visible. In other words, to have a look at the column names, one has to again go to the top of the page. Since the column headers aren't visible as the page is scrolled down, users don't get to know to which column a particular record belongs to (there are 21 columns in total).
To overcome this, I have included a JavaScript code which ensures that when the page is scrolled down, the column headers also scroll down so that users can see to which column a record belongs to. Please note that these column headers should be visible only when the page is scrolled down. When the user is at the top of the page, there is already a static row of column headers which is the very first row in the HTML table. Please have a look at http://www17.brinkster.com/arpand/atlantic/job2/test.asp to get an idea of my problem.
As such, JavaScript has resolved my problem but there is a minor hitch. When you visit the above mentioned URL, you will find that the row of column headers (which should actually scroll down/up but shouldn't be displayed when the user is at the top of the page) can be seen as the page is loading. Once the page gets loaded completely, this row of column headers disappears & only when a user starts scrolling down, that row of column headers appears. I don't want that row of column headers to appear when the page is being loaded. It should only appear when users no longer can see the static column headers (first row of the HTML table).
That row of column headers is enclosed within <div id="headerfloat"></div> which in turn is in another HTML table whose id="ln". To ensure that that row of column headers doesn't appear when the page is loading, I added the following function in the body's onLoad event:
<script language="JavaScript">
function hideDiv(){
headerfloat.style.visibility="hidden"
ln.style.visibility="hidden"}
</script>
<body onLoad="hideDiv()">
but this doesn't do the needful.
How do I ensure that when the page is loading, that row of column headers (which should scroll down/up but shouldn't be displayed when the user is at the top of the page) remains hidden/invisible to the user?
Thanks,
Arpan