背景がぼやけて表示される

Question

ページにぼかし効果を作成しようとしています。私は、ポップアップを表示し、残りのページがぼやけています。しかし、私は、ページ上の実際の要素ではなく、背景の画像をぼかすことができるように見えますが、私も可能なことをしようとしていますか？

Answer 1

個々の要素をぼかすことはできますが、ぼかしオーバーレイを作成することはできません。

幸いにも、CSS -prefix-filter: blur(##)は自動的に子要素に適用されます。何が必要なのは、を除いて、のdiv内のポップアップを除いて、apply the blur to thatです。

例JS：

$('body > *').wrap('<div class="blur-all">').append($popup); 

CSS：

.blur-all { 
    -webkit-filter: blur(10px); 
    -moz-filter: blur(10px); 
    -o-filter: blur(10px); 
    -ms-filter: blur(10px); 
    filter: blur(10px); 
} 

は、あなたがポップアップで終わったら.blur-allの子供たちのラップを解除することを忘れないでください。