javascript - 如何使用简单的 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%;
 }