Html 单击“将div放置在按钮上方”

单击按钮后，我想在按钮上方放置一个div，如下图所示：

---

有什么办法吗？

将按钮和div面板放在父div中。将弹出div设置为绝对和隐藏

.parent-div{
   position:relative;
}

.popup-div{
   position:absolute;top:0px;left:0px;
   z-index:10;
   display:none;
}

在btn单击时显示弹出div

$(".btn").on("click", function(){
   $(".popup-div").show();
});

---

你能做到！假设您的按钮位于页面的左下角

我将只显示基本的，只有按钮和div的代码。希望它有帮助

为此：

.button, .div {
position: absolute;
bottm: 0;
left: 0;
}
.div {
display: none; // to make it hidden.
}

HTML将是：

<button class="button">I am button</button>
<div class="div">I am on the button!</div>

---

是的，但原因是什么？为什么不禁用它，或者完全删除它？禁用它？为什么？@Dark1007我认为这里有一个歧义：“在按钮上放置一个div”可能意味着创建一个与按钮重叠并隐藏的div，或者在页面上创建一个垂直高于按钮的div（例如“input something”div）（按钮在下方仍然可见），就像在您的图像中一样。你应该澄清你指的是哪一个。你的意思是“在按钮上方”还是？我想你指的是前者，但“超过按钮”通常被认为是指后者。

$(document)ready(function() {
  $(".button")click(function() {
    $(".div").show();
  })
})