Как насчет динамического виджета ширины / высоты, который загружает изображение, фильтрует размытие и довольно точно устанавливает содержащий элемент в слое z-index, над модальной подложкой и под модальным содержимым. В качестве альтернативы http://plugins.jquery.com/project/blurimage, или http://www.nihilogic.dk/labs/imagefx/ также выглядит многообещающе.
РЕДАКТИРОВАТЬ: В ответ на ваш "частичный комментарий размытия изображения"
Используя этот виджет Flash и позиционирование, да - с моей головы вы можете попробовать двухслойный SWF в полном размере, нижний слой содержит актив изображения, как и слой над ним, этот верхний слой будет полностью размыто - и верхний слой тоже замаскирован. Измените размер маски на открытую панель (при необходимости настройте несколько обработчиков одного размера и т. Д.). Если ваши панели можно перетаскивать, отслеживайте положение панели HTML в сравнении с положением второго слоя размером с панель во Flash, в конечном итоге перемещаясь вокруг маски, чтобы показать только размытую область того, что выглядит как одно изображение.
Также обратите внимание, что вам нужно ExternalInterface
, чтобы это было эффективно, так что мин. Flash Player 8, который превосходит редкие реализации браузера, перечисленные в http://www.nihilogic.dk/labs/imagefx/.
На ум приходит еще одна вещь, которой могут понадобиться только два элемента <div>
, каждый из которых содержит одно и то же изображение, как указано выше, расположенные друг над другом, как указано выше, и вы будете манипулировать свойствами CSS-клипа по отношению к размеру / положению вашей непрозрачной панели. Если бы это была YUI Panel , вы могли бы использовать модальный нижний слой в качестве «нижнего слоя» в моем примере Flash выше, а сама панель обернута, чтобы вы могли использовать там CSS-клип и размытие JS. , может быть, даже background-position:fixed
и JS Blur могли бы помочь ... Я был бы рад увидеть некоторые из ваших попыток, если вам удастся попробовать что-нибудь - если бы у меня было немного свободного времени!