用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。我希望这就是你的意思。

div javascript 容器容器滚动滚动

用Javascript滚动DIV容器内的DIV

问题描述

解决方法

相关问答