Gaussian Blur (compatible)

Note: Gaussian blur is to add blur to the content of the page behind the pop-up frame, adding an object error will be invalid

<image src='https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1563191496238&di=21d2f25a30afc5cf2d154654cb0f536d&imgtype=0&src=http%3A%2F%2Fpic32.nipic.com%2F20130810%2F7772606_170808427000_2.jpg' mode='widthFix' class='bg_pic'></image>

<!-- 背景高斯模糊图片 -->
<view class='pic_'>
  <image src='https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1562819349252&di=da8c10500bc633024f5b33888941ade0&imgtype=0&src=http%3A%2F%2Fb-ssl.duitang.com%2Fuploads%2Fitem%2F201606%2F10%2F20160610121636_i2EWn.jpeg' mode='aspectFill' class='pic'></image>
</view>

CSS：

.bg_pic {
  position: fixed;
  top: 25vh;
  left: 10vw;
  width: 80vw;
  z-index: 999;
}
.pic_ {
  position: fixed;
  display: block;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  -webkit-filter: blur(20px);
  -moz-filter: blur(20px);
  -ms-filter: blur(20px);
  -o-filter: blur(20px);
  filter: blur(20px);
  z-index: 99;
  overflow: hidden;
}
.pic_ .pic {
  width: 100vw;
  height: 100vh;
}

Attached drawing: