假设你有一个带有CSS工具提示的元素，你要把这些工具提示放在元素的旁边，使其在悬停时打开（或者可能更好：当被点击时）。挨着它在哪里？在它上面吗？如果该元素已经非常接近屏幕的顶部呢？在这种情况下，它可能应该在它下面打开。反之亦然--屏幕的左边和右边也是如此。你肯定希望它是可见的，而不是溢出视口的。
有时，当你打开新的UI元素时，它们需要有边缘意识，以防止里面的内容触发奇怪的滚动条，或者更糟的是，切断内容。
非常重要的是什么？
这是网络上一个古老的问题。我记得我是故意使用jQuery UI工具提示的，因为它有这种特殊的边缘感知能力。你可以想象它背后的JavaScript。你找出元素的位置，并使用定位数学来计算它是否会在视口内。如果它不在视口内，就尝试一个适合的不同位置。
与以往一样，一切旧的东西都是新的。看看浮动的用户界面，就是为这个问题而设计的。
Floating UI是一个低级别的工具包，用于定位浮动元素，同时智能地保持它们在视图中。工具提示、弹出式窗口、下拉式窗口、菜单，以及更多。
它看起来做得超级好。我喜欢这个重点，演示做得超级好，而且它是一个相当小的依赖性。
但你知道什么会更酷吗？如果CSS可以自己做这些事。这就是CSS锚定定位的氛围--现在只是一个 "解释 "文件。
在构建交互式组件或应用程序时，作者经常希望利用可以在 "顶层 "呈现的UI元素。这种UI元素的例子包括内容选取器、教学UI、工具提示和菜单。"启用弹出式窗口 "引入了一个新的
popup元素，使许多这些顶层元素更容易编写。作者经常希望将这种顶层用户界面 "钉 "或 "锚 "在另一个元素上，这里称为 "锚元素"。顶层用户界面如何相对于其锚定元素定位，进一步受到布局视口边缘的影响或限制。
我喜欢它。网络平台是最好的。看到作者需要做什么，并伸手去找库来做什么，并试图介入，以原生的方式来做（而且希望做得更好）。
