Forum Moderators: not2easy
I have a large div with overflow:auto, and javascript that places nested divs and moves them around inside this div. I would like for the div to allow me to scroll and see any of the nested divs if they move too far in any direction.
Currently the scroll bars handle everything fine if one of the nested divs moves past the right or bottom borders of the main div, but simply hides them if they move past the top or left borders.
Any ideas how to get it to allow me to scroll left or up from the starting position?
Here is some example code that avoids javascript but should give an idea of what I want. I'd like to be able to scroll to read all of the text on this page:
[pre]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<title>scroll test</title>
<style type="text/css">
div.container {
border:1px solid;
height:100px;
width:200px;
position:fixed;
left:200px;
top:200px;
overflow:scroll;
}
p {
margin:-10px;
white-space:nowrap;
}
</style>
</head>
<body>
<div class="container">
<p>
This is some text.<br>
It has multiple<br>
lines. This line is long enough for a right-scroll.<br>
</p>
</div>
</body>
[/pre]
any help you could offer would be much appreciated.
Thanks,
Peter
I have witnessed this before however in my experience this is simply a sign that we are attempting to achieve a goal using the standards out of context.
I'm not sure what your related goal is? Could you please clarify how this relates to something you have not posted? Or is this simply an oddity you're curious about?
- John
Essentially:
Is there any way to have the content of the window expand upward or to the left (after page load) without becoming completely inaccessible? It seems like this is what the overflow property is supposed to handle, but it only seems to handle it in two of four directions.
(there are probably huge javascript solutions to this, but I'd like to avoid adding more heavy scripting in an already script-heavy site.)
Thanks!
Peter
Set the divisible element to overflow: scroll; then, I've never encountered a situation where you don't get horizontal scrollbars. It does not mean it will become scrollable to the left or the top however. It seems to me that sort of desired behavior needs to be programmed via JavaScript to enable you to scroll left/upwards further then the browser default.
- John
