60 lines
1.2 KiB
HTML
60 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
.comp {
|
|
-webkit-transform: translateZ(0px);
|
|
}
|
|
body {
|
|
margin:0;
|
|
padding:0;
|
|
}
|
|
.shadow {
|
|
position:absolute;
|
|
left:20px; right:20px;
|
|
width:500px;
|
|
height:500px;
|
|
top:0px; bottom:20px;
|
|
z-index:120;
|
|
margin-top:20px;
|
|
border: 1px solid transparent;
|
|
-webkit-box-shadow: 0 0 6px #090;
|
|
background-color: #090;
|
|
}
|
|
#scroll {
|
|
overflow-y: hidden; /* scrollable but no scrollbars visible. */
|
|
width:500px;
|
|
height: 500px;
|
|
}
|
|
.scrollContent {
|
|
width:100%;
|
|
height: 1000px; /* make the container scrollable */
|
|
background-color: #0d0;
|
|
}
|
|
</style>
|
|
<script type="text/javascript">
|
|
if (window.testRunner) {
|
|
testRunner.dumpAsText(true);
|
|
testRunner.waitUntilDone();
|
|
}
|
|
|
|
window.onload = function() { setTimeout(function() {
|
|
document.getElementById('scroll').scrollTop += 300;
|
|
if (window.testRunner) {
|
|
testRunner.notifyDone();
|
|
}
|
|
}, 0); };
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<!-- If culled incorrectly, the top/left edges outside of the shadowed box end up being culled instead of painted/drawn properly. -->
|
|
<div class="comp shadow">
|
|
<div id="scroll">
|
|
<div class="scrollContent">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|