поставить прозрачность всего кроме div - PullRequest
Новая
       0

поставить прозрачность всего кроме div

0 голосов
/ 17 января 2012

Я пытаюсь найти способ придать прозрачность всему, кроме одного div.И просто, чтобы позволить нажать на этот конкретный div.Вероятно, это простой вопрос, но у меня нет идей, где найти ответ.Я думаю, что это может быть что-то вроде эффекта модального диалога ... но с моим конкретным div ...

Ответы [ 4 ]

1 голос
/ 17 января 2012

Потому что он был помечен 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});
1 голос
/ 17 января 2012

Вам не нужно jquery.Вы можете сделать это только с помощью CSS.

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

Экран подавления CSS, такой как предупреждение Javascript

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

1 голос
/ 17 января 2012

Это встроенный в пользовательский интерфейс jQuery, поэтому вам не нужно использовать дополнительные плагины. Просто включите файл пользовательского интерфейса вместе с 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;
}
1 голос
/ 17 января 2012

Попробуйте jquery оверлей .Это должно удовлетворить ваши потребности.

...