Javascript svg rect不会响应另一个具有高z索引的div

我想让svg标记中的矩形显示出来，并在悬停时更改不透明度。我让整个代码都正常工作了，但是在添加了一个具有高z索引的固定div之后，svg就不再工作了（悬停效果短暂但并不一致，所以我知道元素仍然在它们应该在的位置）

.hover_组：hover
{
不透明度：1；
}
#项目SVG
{ 
位置：相对位置；
宽度：100%；
垂直对齐：中间对齐；
保证金：0；
溢出：隐藏；
利润率：10px；
}
#项目svg svg
{ 
位置：相对位置；
浮动：左；
排名：0；
左-199；
}
//设置背景图像
你好

---

有没有办法修复这个bug，或者我必须手动编写代码？

根据您展示的代码，它似乎可以工作：谢谢您的回复。我也刚刚得出结论，代码本身是好的。我还刚刚意识到我有一个固定元素，它的z索引比div高，这导致svg没有响应。

<style>
        .hover_group:hover
        {
            opacity:1;
        }
        #projectsvg 
        { 
            position: relative;
            width: 100%; 
            vertical-align: middle; 
            margin: 0; 
            overflow: hidden; 
            margin:10px;

        }
        #projectsvg svg 
        { 
            position: relative; 
            float: left;
            top: 0; 
            left: -199; 

        }
</style>
<div class="row" style="background-image: url(../img/home/blue_bk.jpg);">
    <div class="col-xs-1 col-sm-0"></div>
    <div class="col-xs-10 col-sm-5 col-lg-4">
    <figure id="projectsvg">
        <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="500 -50 920 1180" preserveAspectRatio="xMinYMin meet" >
            //set your background image
        <image width="1920" height="1080" xlink:href="../img/home/pain_chart3.png">
        </image>
        <!-- Shoulder-->
        <g class="hover_group" opacity="0">
        <a xlink:href="#">
        <rect x="762" y="130.1" opacity="0.2" fill="#FFFFFF" width="204.6" height="107.8"></rect>
        </a>
        </g>
        <!-- Hand-->
        <g class="hover_group" opacity="0">
        <a xlink:href="#">
        <rect x="762" y="300.1" opacity="0.2" fill="#FFFFFF" width="204.6" height="107.8"></rect>
        </a>
        </g>
        <!-- knee-->
        <g class="hover_group" opacity="0">
        <a xlink:href="#">
        <rect x="862" y="560.1" opacity="0.2" fill="#FFFFFF" width="180.6" height="80.8"></rect>
        </a>
        </g>
        <!-- Elbow-->
        <g class="hover_group" opacity="0">
        <a xlink:href="#">
        <rect x="1132" y="190.1" opacity="0.2" fill="#FFFFFF" width="204.6" height="107.8"></rect>
        </a>
        </g>
        </svg>
    </figure>
    </div>

    <div class="col-xs-12 col-sm-7 col-lg-8">
        <h1>hello</h1>
    </div>

</div>