小编lea*_*rof的帖子

Safari:即使有隐藏元素,阴影过滤器仍然可见

我正在将阴影过滤器应用于根据用户交互显示和隐藏的 div(下拉列表),但是,在 Safari 中,即使元素被隐藏,阴影仍然可见。

该错误仅发生在 Safari 中。

document.querySelector('.bt').addEventListener('click', function () {
    let b = document.querySelector('.b');

    if (b.style.display === "none") {
        b.style.display = "block";
    } else {
        b.style.display = "none";
    }
})
Run Code Online (Sandbox Code Playgroud)
.bt {
    padding: 10px;
    margin-bottom: 40px;
}

.a {
    height: 100px;
    padding: 20px;
    background: #ccc;
}

.b {
    position: relative;
    width: 50px;
    height: 50px;
    background: #0f0;
    filter: drop-shadow(0 0 0.125rem #000);
}

.b::after {
    content: '';
    position: absolute;
    display: inline-block;
    width: 0;
    height: 0;
    border-right: .5rem solid transparent;
    border-left: …
Run Code Online (Sandbox Code Playgroud)

html css safari

6
推荐指数
1
解决办法
1544
查看次数

标签 统计

css ×1

html ×1

safari ×1