ставить прозрачность все, кроме 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 overlay. Он должен соответствовать вашим потребностям.

Answer 3

Вам не нужен jquery. Вы можете использовать только CSS.

Мой ответ здесь должен решить проблему:

CSS suppress screen like Javascript alert

Создать DIV с позиции: фиксированная что высота и ширина 100%. Затем установите фон либо rbga (255,255,255, .8), либо повторяющийся квадратный белый pppp размером 1px (либо с непрозрачностью по вашему выбору). Наличие содержимого наложения div с непрозрачным белым фоном дает такой же эффект, как уменьшение фактической непрозрачности основного содержимого.

Answer 4

Это встроенный пользовательский интерфейс jQuery, поэтому вам не нужно использовать дополнительные плагины. Просто включите файл UI вместе с jQuery. И замените слово «jQuery» на «$». Убедитесь, что значение параметра, которое вы передаете для параметра «obj», является идентификатором вашего тега div. Обратите внимание, что мы ссылаемся на страницу для «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; 
}