将除 div 之外的所有内容设置为透明

Question

我正在尝试找到一种方法，让除了一个 div 之外的所有内容都具有一定的透明度。并且只是允许单击该特定的 div。这可能是一个简单的问题，但我真的不知道在哪里可以找到答案。我认为这可能类似于模态对话框效果...但是对于我的特定 div...

Answer 1

因为它被标记为 jQuery

$('#fields input:not(#the_one_field_to_stay_active)').attr('disabled');
$('#fields textarea:not(#the_one_field_to_stay_active)').attr('disabled');
$('#fields *:not(#the_one_field_to_stay_active)').click(function() {return false});
$('#fields *:not(#the_one_field_to_stay_active)').css({opacity: 0.8});

Answer 2

尝试 jquery 覆盖。它应该满足您的需求。

Answer 3

这是内置于 jQuery UI 中的，因此您不需要使用任何额外的插件。只需将 UI 文件与 jQuery 一起包含即可。并将单词“jQuery”替换为“$”。确保为“obj”参数传递的参数值是 div 标签的 id。请注意，我们正在引用“dData”页面，因此如果您必须重复使用此对话框或已共享该对话框，则可以重复使用它。但如果您希望以其他方式定义数据，则可以更改这一点。

<script type="text/javascript" src="/scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="/scripts/jquery-ui-1.8.10.custom.min.js"></script>

// dTitle - title of the modal dialog being displayed
// dWidth - width as a fraction of 1 relative to the width of the window
// dHeight - height as a fraction of 1 relative to the height of the window
// dData - the URL and query string of the page being requested within the object tag
// obj - id of <div> tag
// objType - type of object (ie: "text/html", "application/pdf", etc...)
function DisplayModalHTML(dTitle, dWidth, dHeight, dData, obj, objType) {
    var content = "<object id='jQueryObject' type='" + objType + "' data='" + dData + "' width='100%' height='100%' />";
    jQuery(obj).empty();
    jQuery(obj).attr("title", dTitle);
    jQuery(obj).html(content);
    jQuery(obj).dialog({
        autoOpen: true,
        modal: true,
        width: jQuery(window).width() * dWidth,
        height: jQuery(window).height() * dHeight,
        resizable: true,
        draggable: true,
        buttons: {

            'Close Report': function() { jQuery(this).dialog('close'); }
        }
    });

    return false;
}

Answer 4

你不需要jquery。你可以单独使用CSS。

我在这里的回答应该可以解决您的问题：

CSS 抑制屏幕，如 Javascript 警报

创建一个 div，其位置：固定，高度和宽度均为 100%。然后将背景设置为 rbga(255,255,255,.8) 或重复的 1px 方形白色不透明 png（具有您选择的不透明度）。使用具有不透明白色背景的 div 覆盖内容与降低底层内容的实际不透明度具有相同的效果。