如何使用简单的JavaScript / CSS将元素放在DOM中任何给定元素的上方？

Question

我想使用JavaScript在页面的任何元素的右上角放置一个新元素（非常像通知气泡）。最简单的方法是什么？

我需要这些条件：

1. 目标元素可以是此页面上的任何元素，例如，可以在内部滚动的div中的元素。
2. 即使用户调整页面大小或滚动页面，新元素也应与目标元素保持一致。

我想是要计算目标的大小，然后添加一些样式，例如top或right的元素，但我不知道该如何真正实现。

感谢任何提示。

Answer 1

为此使用CSS。 父div将是相对位置：

.someDiv{position: relative}

然后将通知div放在父div上方，如下所示：

    <div class="someDiv">
      <span class="notiBubble">{{DYNAMIC DATA}}</span>
    </div>

css：

 .notiBubble{
    position: absolute;
    top: -20px;
    right: -10px;
    display: inline-block;
    background: #ff0;
    padding: 9px 15px;
    z-index: 999;
    border-radius: 100%;
 }