3

弹出窗口有什么方法不仅可以模糊文本,还可以模糊背景中的图像?我附上了一张视觉图。在此处输入图像描述

4

3 回答 3

5

也许blur.js可以帮助你!

留意演示

于 2012-06-14T17:53:23.973 回答
1

这就是你要找的。CSS3 灯箱

他们做了一个类似的弹出窗口实现,然后模糊背景。一探究竟。我相信它会对你正在做的事情有所帮助。

于 2012-06-15T04:41:49.890 回答
0

这就是stackoverflow的做法。

HTML

<div class="popup">

    <div class="blur-bg"></div>

    <div class="popup-win"><img src="foo.jpg"/></div>
</div>

CSS

    .blur-bg{
            position: absolute;
            top: 0px;
            z-index: 1000;
            opacity: 0.5;
            height: 2323px;
            left: 0px;
            width: 100%;
            background-color: black;
        }
    .popup-win{
            position: fixed;
            width: 400px;
            z-index: 1001;
            top: 50%;
            left: 50%;
            display: block;
            margin-top: -85px;
            margin-left: -215px;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
            background-color: #fff;
            padding: 15px!important;
        }
于 2013-03-15T10:47:12.990 回答