Chrome CSS模糊过滤器通过模态出血

时间:2014-07-10 16:31:26

标签: css google-chrome webkit chromium

我在我的应用程序中对图像使用webkit模糊过滤器。在Chrome上(仅限Chrome,据我所知),每当我弹出一个模态并对模态中的任何内容执行某种鼠标悬停事件时,图像中的模糊似乎会在模态中流失,就好像模糊滤波器上的z-index更大(虽然我知道它不是。)

之前是否有其他人遇到此问题?我用Google搜索了它,无法找到相关信息。

2 个答案:

答案 0 :(得分:1)

我知道这是一个老问题,但这是解决出血问题的方法。见plunk

关键部分是使用

-webkit-transform: translate3d(0, 0, 0);
overflow: hidden

答案 1 :(得分:0)

这里只是一个长镜头,但也许可以尝试添加溢出:隐藏到它溢出的元素 - 以及设置的宽度和高度(http://jsfiddle.net/kerr325/o9mkpme9/):

.your-element {
    height:120px;
    width:200px;
    overflow:hidden;
}