crossbrowser scroll with variable position?

[ThomasJSmart]

Hi,

Iv been trying all kinds of scroll scripts but none of them do what i want. I know enough html/js to modify scripts a little to suite my needs but this lil problem seems beyond my (or browser?) abilities..

1. i need to scroll some content. The content can be anything generaly as it is loaded from a db with php but mostly it will just be simple html code, forms, images, text, etc.

2. i dont want to use frames or iframes to load the content as an external source file because the site is finished and this is just an extra feature that was requested. using frames would mean i would have to redo most of the site.

3. the position of the div/span (which i assume must be used to do this?) is a bit variable:

X position: the whole site is in 1 file and its centered horizontaly inside a table. so X starting position would be (window_width/2)-(content_width/2) OR, which i prefer, just the location of the DIV layer in the TD. If i dont give a DIV layer an X/Y position then it starts on the right place automatically.

Y position, the location of DIV layer in the TD or 95px from the top.

WIDTH: variable, but i can set it with php, lets say 970 pixels to keep it easy

HEIGHT: well... about 100% (window_height) - 95px(top bar) - 40 px(bottom bar), would be nice if it resized to fit when the user resizes the window....

4. yes thats about it.. ow yea... crossbrowser, eeek thats the difficult bit, thats where i keep messing up >.< iv made 2 realy nice scrollers, with custom arrows/scrollbar (which i would like in this script to..) works fine in IE and firefox... but then netscape enteres -_- and an apple computer -_-!

So any ideas? possible or not?
if theres an existing script somewhere thats shareware i dont mind paying for it by the way.


I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!

 

[Vragabond]

I don't understand. This seems to be easily achieveable simply by using css. Except maybe for the 100% height part. And you would use the regular scroller that exists in the OS.

 

[vacunita]

I agree with Vrag,
Why go to all that scripting troubled when a simple CSS will give you the scrollbars.

.myDIV
{
width:150px;
height:150px;
overflow:auto; (it can also be [blue]scroll[/blue], and either one will give you scrollbars when content exceeds width and/or height.)
}

----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[ThomasJSmart]

well the problem is the 100% (of the TD) height....
this where it all goes to hell :/

Some browsers seem to think that 100% is 1 pixel high. I dont have this problem with iframes, i can just say 100% height overflow:auto, and its all perfect, with DIVS it doesnt seem to be so easy :/

and this is just using the browser default scrollbar. when trying to make somethinh using my own scrollbar it gets even worse >.<



I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!

 

[vacunita]

I believe this works the way you want it to:

<table border=1px style="height:100%;"><tr><td>Other text in other cell</td><td>
<div style="top:1px; left:10px; width:459px; height:100%; overflow:scroll; border:1px 

solid blue; background-color:white;">Lost o text test text text txt text textLost o 

text test text text txt text textLost o text test text text txt text textLost o text 

test text text txt text textLost o text test text text txt text textLost o text test 

text text txt text textLost o text test text text txt text textLost o text test text 

text txt text textLost o text test text text txt text textLost o text test text text 

txt text textLost o text test text text txt text textLost o text test text text txt 

text textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

textLost o text test text text txt text textLost o text test text text txt text 

text</div>
 </td></tr></table>

The div fills up the table cell, it scrolls, and shrinks and grows when the browser is resized.



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

 

[BillyRayPreachersSon]

It might depend on the DOCTYPE you are using, and whether IE is in quirks mode or not, as to whether 100% means 100% or not.

With the example above, there is no DOCTYPE, and so IE will be in quirks mode (which means 100% height will probably work). Add in a DOCTYPE and it will probably stop working.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[ThomasJSmart]

what about none-IE browsers? specifically apple systems.... will it work the same on these ?

I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!

 

[BillyRayPreachersSon]

Apple systems can run many browsers, so it would depend on which browser is in use. You'd need to test it to find out.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]