Javascript 如何使子div具有固定位置？

我正在想办法使潜水器处于固定位置。单击父div时，子div将在相对位置向下切换。我不想那样。我希望子div处于固定位置，以便覆盖下一个div。就像select一样。 工作小提琴

HTML

JavaScript/jQuery

$(".select-box-funds").on("click", function (e) {
    e.preventDefault();
    var isSelected = $(this);
        $(isSelected).children(".funds-info").toggle();
        $(isSelected).toggleClass("active");
});

---

您应该使用以下属性修改此css类：

.select-container-funds .funds-info {
    position: absolute;
    background: #4682b4;
    z-index: 1; /* should be >=1 */
    width: 100%;
...
}

---

尝试执行以下css更改

.select-container-funds .funds-info {
  height: 375px;
  border-top: 2px solid #90ee90;
  display: none;
  position: absolute;
  z-index: 100;
  width: 100%;
  background: gray;
}

---

听起来你想要的是

position:absolute

而不是

fixed

那么，你能定制我的小提琴吗？@Paulie\u D代码已经提供，OP甚至做了一把小提琴。就因为你看了超过5行，你突然变成了一个编码服务？好吧，我把位置设为绝对。问题是另外两个女主角隐藏在第一个女主角的后面。如何把他们分开？是的，对不起…这是糟糕的一天，我当时的角度不对。我来看看。给你-我也尝试过这个选择。。。当您按下第二个“选择”按钮时出现问题，第一个“选择”按钮没有覆盖第二个按钮。还有第二个问题，我还没有弄清楚，我如何使子div与父div具有相同的宽度？宽度：100%将解决宽度的问题，当第二个div打开时，您要关闭第一个选择？或者第一个应该超过第二个？嗯，不。我想要的是，如果你按下两个div，两个div都是打开的，你可以比较这两个div里面的信息。这就是为什么我想要第一个div（它的z索引比下面的div多）。希望你能理解！我在这里添加了一行javascript代码。你在找什么？最后单击的div将高于其他div。好的！谢谢我的第二个问题：我如何告诉每个子div有不同的z索引，所以第一个包含第二个，第二个包含第三个，依此类推？我是否应该在每个div中设置一个类，使其具有不同的z索引？编辑：因为我实际上并没有只使用三个选择，所以这个选择在一个循环中，循环重复6次。那么如何告诉每个div有不同的z-索引呢？我不确定我是否理解，在我的演示中，第二个包含了第三个..好的。我要仔细看看！假设你按下第一个div，然后按下第二个div。正如你所看到的，当两个div都被“切换”下来时，第二个div覆盖了第一个div。第一个div的z-index:100，第二个div的z-index:99。。。等等。啊……我不确定你们这里的东西是否真的合适……听起来你们想要的是手风琴之类的东西。Jquery有一个几乎可以做到，但它需要一些调整-

.select-container-funds .funds-info {
    position: absolute;
    background: #4682b4;
    z-index: 1; /* should be >=1 */
    width: 100%;
...
}

.select-container-funds .funds-info {
  height: 375px;
  border-top: 2px solid #90ee90;
  display: none;
  position: absolute;
  z-index: 100;
  width: 100%;
  background: gray;
}

.funds-info {
    /* I also removed the height previously declared as this is now 'auto' */
    position: absolute;
    z-index:2;
    background: #4682b4;
    width:100%;
    top:100%;
}