Scroll bar affecting two frames 1

[stein555]

I am new to programming, and have yet to figure out a way to do this...

I have a table of data (that can be upwards of 1000 entries). I have that being output into an IFrame and all the columns are aligned with another table (outside the frame) that acts as the header (that way it is always at the top as I scroll through the data).

My problem is, the table is wider than the screen and so you have to scroll horizontally to get to the vertical scroll bar for the IFrame. I want to make the vertical scrollbar appear for the iframe, and the horizontal scroll bar still affect both the table data and the header.

Does that make any sense at all?

Let me try to illustrate...(I'm NOT an artist!)

Left Edge of Screen End of Table
|-----------------------------------|--------------------|
|Header |Header |Header |Header |Header |Header |
|-----------------------------------|--------------------|
-----------------------IFRAME------------------------------
| |Data |Data |Data |Data |Data |Data | S |
| |--------|--------|-------|-------|--------|--------| C |
| |Data |Data |Data |Data |Data |Data | R |
| |--------|--------|-------|-------|--------|--------| O |
| |Data |Data |Data |Data |Data |Data | L |
| |--------|--------|-------|-------|--------|--------| L |
| |Data |Data |Data |Data |Data |Data | B |
| |--------|--------|-------|-------|--------|--------| A |
| |Data |Data |Data |Data |Data |Data | R |
-----------------------------------------------------------
SCROLLBAR
-----------------------------------------------------------

Hope that explains my problem a little better...

Thanks...

 

[stein555]

I was just thinking about this and reading some other forums...is there any way that I could turn all that into a table that that has scrollbars? And more specifically, a vertical scrollbar for the bottom half only (while the horizontal scrollbar affects the whole table)...

Does that make any sense/is it doable?

I will start researching that myself, too

 

[deecee]

use an iframe or a layer with overflow set to auto

[Hammer]
Nike Failed Slogans -- "Just Don't Do It!"

 

[stein555]

I am using an IFrame currently. I have to scroll to the right to get to the vertical scollbar for the iFrame (because I need the header to be lined up outside of the frame with the data inside - or I need a different way to keep the header at the top while I scroll through the data)...

I haven't used Layers before, so I will start doing some reading up on those to see if I can figure out how to use them...

Thank you for your advice!

 

[stein555]

After reading up on the Div attribute, I think I am going to switch over to <div> and <table>. That should make it easier for me to line up my columns...BUT, I think I will still have the problem of having to horizontally scroll before I can get to the vertical scroll bar...

I basically just want this to look like an excel spreadsheet that has the first row &quot;fixed&quot; (so it stays at the top if you scroll), AND the vertical scroll bar is available without having to horizontally scroll to it (because the table is too wide for the screen)...

Is this possible with Div's?

 

[deecee]

ya make the div smaller than the screen resolution!

[Hammer]
Nike Failed Slogans -- &quot;Just Don't Do It!&quot;

 

[stein555]

Heh...I would do that, but with how much data I have being output to the screen, it would look horrible...

I may just give up on this and try to go a different route with the design...

 

[qrhythm]

Two ways to do it:
A. Use no IFRAMEs. Just let the content be scrollable horz and vert via the browser scrollbars. Then use an absolutely positioned DIV (style=&quot;position:absolute;top:...&quot to float the header row at the top of the window. All you have to do is set the vertical position; the horz position will remain 0. To set the position you can either use an expression (if you're in IE as it seems you are -- style=&quot;top:expression(document.body.scrollTop)&quot; or something like that) or you can handle the onscroll event on the body tag and reposition it then. The disadvantage here is that you may see some flicker as your script code updates.
B. Use two scrolling DIVs set to be width 100% to position the two tables. Use the onscroll event in the bottom DIV to set the scroll left in the top DIV (div.scrollLeft = otherdiv.scrollLeft). Hide the horizontal scrollbar of the top DIV by setting style.overflowX = &quot;hidden&quot; or scroll = &quot;no&quot;.

 

[stein555]

You are the man qrhythm! This is really close to what I want. I am attempting to use option B now. I got it work partially in I-Frames so I know it is working (scrolling two windows at once), but I can't get it to recognize my top DIV (the header DIV).

I am not vert familiar with the javascript stuff so I am going to keep hacking at it (it basically is telling me that the header is undefined, even though I have a name assigned to it in the DIV).

Anyway, I just wanted to thank you for answering this question!

 

[stein555]

Doh...I'm an idiot - had <div name=&quot;blah&quot;> instead of <div ID=&quot;blah&quot;>...I got it working now...

Thanks a ton!