如何解决用Javascript滚动DIV容器内的DIV
| 我有一个DIV容器,其中有一个SVG文档(大于DIV)。在同一个容器中,我还有另一个DIV(称为DIV#2),它在我的SVG上移动,以帮助人们定位某些功能。当我滚动容器DIV时,我希望DIV#2保持锚定在SVG上的相同位置,以便与所选功能的新位置保持一致(请参见下面的Rect_Follow()函数)。 有人可以帮我解决问题,而无需使用jQuery吗? 这是代码的一小部分: CSS:<style type=\"text/css\">
<!--
div.SVG_container {
height:800px;
width:900px;
margin-top:250px;
overflow:scroll;
}
div.select_div {
position: absolute;
height: 98px;
width: 98px;
background: #CCF;
border: 1px solid #AAD;
text-align: center;
font-size: 10px;
border:1px solid black;
filter:alpha(opacity=60); /* for IE */
opacity:0.6; /* CSS3 standard */
}
-->
</style>
HTML / JavaScript:
<head>
<!-- ... -->
<script type=\"text/javascript\">
function Rect_Follow(obj){
var rect = document.getElementById(\'arect\');
rect.style.top = obj.scrollTop;
}
</script>
</head>
<body bgcolor=\"white\">
<div id=\"DivCont\" class=\"SVG_container\" onscroll=\"Rect_Follow(this)\">
<div id=\"arect\" name=\"arect\" class=\"select_div\"></div>
<object id=\"aSVG\" data=\"out.svg\" style=\"margin-top:0px;overflow:hidden;\" />
</div>
<!-- ... -->
</body>
解决方法
在
.SVG_container
中添加position:relative
,然后删除JavaScript。
我希望这就是你的意思。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。