寻找 JS/JQuery 全模式覆盖

Question

Closed. This question is seeking recommendations for software libraries, tutorials, tools, books, or other off-site resources. It does not meet Stack Overflow guidelines. It is not currently accepting answers.

---

我们不允许提出寻求软件库、教程、工具、书籍或其他场外资源推荐的问题。您可以编辑问题，以便用事实和引文来回答。

9 年前已关闭。

Answer 1

http://developer.yahoo.com/yui/examples/container/panel -loading.html

幸运的是我已经在使用 YUI，只是忽略了这一点。正是我想要的。

Answer 2

我认为只添加覆盖 div 会比使用任何库更容易并且需要更少的代码。

$('<div></div>').css({ top: 0, bottom: 0, left: 0, right: 0, position: absolute, zIndex: 1000 }).appendTo(document.body);

Answer 3

您可以仅使用 CSS 来实现这一点，并使用覆盖 div 绝对定位于其容器的顶部、左侧、右侧、底部 0，如下所示：

HTML

<div class="overlay"></div>
<div class="content">
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
    <button type="button">Click Me!</button>
</div>

CSS

.content {
    width:400px;
    height:400px;
    position:relative;
    z-index:1;
}

.overlay {
    opacity:0;
    filter: alpha(opacity = 0);
    position:absolute;
    top:0; bottom:0; left:0; right:0;
    display:block;
    z-index:2;
    background:transparent;
}

演示 < a href="http://jsfiddle.net/andresilich/WHEK3/4/" rel="nofollow">http://jsfiddle.net/andresilich/WHEK3/4/