@qooxdoo/framework
Version:
The JS Framework for Coders
80 lines (63 loc) • 3.14 kB
HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="../helper.js"></script>
</head>
<body>
<style type="text/css">
div{
border: 10px solid black;
}
div div{
border: 2px solid black;
}
</style>
<div id="bottom" style="position:absolute;top:2000px;"> </div>
<div id="a1" style="position:absolute;background:yellow;top:40px;left:40px;overflow:scroll;width:100px;height:100px">
<div id="a2" style="position:absolute;width:20px;background:red;height:20px;top:300px;left:20px">
</div>
<div id="a3" style="position:absolute;width:20px;background:orange;height:20px;top:400px;left:20px">
</div>
<div id="a4" style="position:absolute;width:20px;background:blue;height:20px;top:500px;left:20px">
</div>
<div id="a5" style="position:absolute;width:20px;background:green;height:20px;top:600px;left:20px">
</div>
</div>
<div id="b1" style="position:absolute;background:yellow;top:40px;left:200px;overflow:scroll;width:200px;height:100px">
<div id="b2" style="position:absolute;width:20px;background:red;height:200px;left:10px;top:20px">
</div>
<div id="b3" style="position:absolute;width:20px;background:orange;height:200px;left:40px;;top:40px">
</div>
<div id="b4" style="position:absolute;width:20px;background:blue;height:200px;left:70px;;top:80px">
</div>
<div id="b5" style="position:absolute;width:20px;background:green;height:200px;left:100px;;top:120px">
</div>
</div>
<a style="position:absolute;top:280px;left:20px" href="javascript:demobrowser.demo.bom.ScrollIntoView.test()">Dimension test</a>
<div id="z1" style="background:red;width:100px;height:100px;overflow:visible;position:absolute;left:20px;top:300px">
</div>
<div id="z2" style="background:orange;width:100px;height:100px;overflow:scroll;position:absolute;left:20px;top:420px">
</div>
<div id="z3" style="background:blue;width:100px;height:100px;overflow:auto;position:absolute;left:20px;top:540px">
</div>
<div id="z4" style="background:green;width:100px;height:100px;overflow:auto;position:absolute;left:20px;top:660px">
</div>
<div id="z5" style="background:red;width:100px;height:100px;overflow:visible;position:absolute;left:200px;top:300px">
<div style="height:300px"> </div>
</div>
<div id="z6" style="background:orange;width:100px;height:100px;overflow:scroll;position:absolute;left:200px;top:420px">
<div style="height:300px"> </div>
</div>
<div id="z7" style="background:blue;width:100px;height:100px;overflow:auto;position:absolute;left:200px;top:540px">
<div style="height:300px"> </div>
</div>
<div id="z8" style="background:green;width:100px;height:100px;overflow:hidden;position:absolute;left:200px;top:660px">
<div style="height:300px"> </div>
</div>
<div id="s1" style="position:absolute;left:400px;top:200px;background:yellow;width:100px;height:100px">
<div id="s2" style="position:absolute;left:0px;top:0px;background:orange;width:100px;height:100px">
</div>
</div>
</body>
</html>