1

重複の可能性:
CSS を使用して HTML の Img と Div をぼかす

基本的に私がやりたいことは、div要素の背後にあるコンテンツの魔女をぼかすことです。つまりdiv、不透明度は 0 - 0.5 です。

ここにjsFiddleがあります

EDIT[1]:私が実際に欲しいのは、 adivが画像の上を行き、 の下の領域divがぼやけていることです。 EDIT[2]: div withposition: absoluteは他の要素を越えてそれらをぼかします。

4

2 に答える 2

0

アップロード時に画像をぼかす必要があります。次に、アップロード時に他の画像をトリミングします (または jQuery/css を使用してトリミングします)。次に、この効果を達成するために必要なものを組み合わせます。

このタスクに css を使用することは不可能です。このタスクに JavaScript を使用するのはお勧めできません (非常に遅い)。

唯一のオプションは、背景画像でこの手法を使用し、その上に別の (js/upload でトリミングされた) ものを配置することです。

于 2012-07-24T22:41:30.177 に答える
0

@Keith Nicholas のコメントで参照されているPurmouの回答をフォローアップすると、次のようなことができます。

topblur{
    position: absolute;
    top:2px;
    left:2px;
    width: 100%;
    height: 150px;
    background-image:url(http://www.stefanides.com/home/yard/back%20yard.jpg);
    opacity: 40;
    filter:alpha(opacity=40); 
    border: thin solid black;
}

素晴らしい解決策ではありませんが、画像が台無しになります!

于 2012-07-24T21:36:13.993 に答える