Есть ли способ создать модальную« область видимости »для диалогов jQuery? В качестве несколько надуманного примера у меня есть страница:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Console</title>
<link href="console.css" rel="stylesheet" type="text/css" />
<link href="libs/jquery-ui/jquery-ui-1.8.13.custom.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="libs/jquery/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="libs/jquery-ui/jquery-ui-1.8.13.custom.min.js"></script>
</head>
<body>
<div id="toolbar"></div>
<div id="mainContent"></div>
<div id="footer"></div>
</body>
</html>
Я хочу создать несколько модальных диалогов для области mainContent. Когда диалоговое окно открыто, я хочу не разрешать взаимодействие с областью mainContent, но все же разрешать взаимодействие с панелью инструментов и нижним колонтитулом.
Или, если страница имеет несколько mainContent- как и div, у каждого есть собственный независимый набор модальных диалогов, которые по-прежнему позволяют взаимодействовать с другими div.
Я знаю, как создавать модальные диалоги с библиотекой jQuery UI; мой вопрос конкретно о применении модальности к разделу страницу, а не всю страницу, либо с использованием этой библиотеки, либо способом, который легко дополняет эту библиотеку.