Javascript 我在jQuery中使用CSS时遇到一些问题

我有一个网页，其中有一些对话框。我为这些对话制作了一个模糊的背景。到目前为止，它工作正常。但是，当用户关闭对话框时，“我的所有样式”都将损坏。例如，边界半径将消失并溢出：“隐藏”无法正常工作。为什么会发生这种情况。我怎样才能解决这个问题

这是打开对话框的代码：

$("#faq").click(function(){
    $("#bg, #FAQ").slideDown(300);
    $("#b").css("-webkit-filter","blur(100px)");
});

$("#bg").click(function(){
    $("#addtocart, #tamas, #about, #khabar, #FAQ, #bg").fadeOut(500);
    $("#b").css("-webkit-filter","blur(0px)");
});

这是关闭对话框的代码：

$("#faq").click(function(){
    $("#bg, #FAQ").slideDown(300);
    $("#b").css("-webkit-filter","blur(100px)");
});

$("#bg").click(function(){
    $("#addtocart, #tamas, #about, #khabar, #FAQ, #bg").fadeOut(500);
    $("#b").css("-webkit-filter","blur(0px)");
});

另外，当我使用这段代码显示对话框时，一切都会比以前慢。如何解决这个问题

这是HTML代码：

<div id="b">
    <nav id="navigation">
        <a href="http://www.address.net"><img src="images/HSLogo.png" id="Logo"></a>
        <span id="Logotext">Store</span>
        <ul id="nav_list">
            <li id="faq">Item 1</li>
            <li id="tbm">Item 2</li>
            <li id="abu">Item 3</li>
            <li id="nws">Item 4</li>
        </ul>
    </nav>



    <section id="products">
        <div id="prdct10" class="product">
            <img src="images/10ditcb.png" title="...اطلاعات بیشتر" class="bg 10d" width="102%" height="102%">
        </div>

        <div id="prdct15" class="product">
            <img src="images/15ditcb.png" title="...اطلاعات بیشتر" class="bg 15d" width="102%" height="102%">
        </div>

        <div id="prdct25" class="product">
            <img src="images/25ditcb.png" title="...اطلاعات بیشتر" class="bg 25d" width="102%" height="102%">
        </div>

        <div id="prdct50" class="product">
            <img src="images/50ditcb.png" title="...اطلاعات بیشتر" class="bg 50d" width="102%" height="102%">
        </div>

        <div id="prdct100" class="product">
            <img src="images/100ditcb.png" title="...اطلاعات بیشتر" class="bg 100d" width="102%" height="102%">
        </div>

        <div id="prdcta" class="product">
            <img src="images/appleid.png" title="...اطلاعات بیشتر" class="bg aid" width="102%" height="102%">
        </div>
    </section>


    <section id="copyright">
        <p>Text Text</p>
    </section>
    </div>

百货商店

第1项
第2项
第3项
第4项

文本

---

感谢阅读

我认为您正在使用

.CSS

命令覆盖CSS，这就是您的其他属性正在消失的原因。请您也共享您的html代码好吗？或者最好是一个JSFIDLE！我以前没有模糊效果。还有其他原因吗？只是一个旁白：当你想消除模糊时，将过滤器设置为初始而不是模糊（0px）。如果仔细观察，您会发现Webkit在设置为模糊（0px）时渲染文本的方式不正确（仍然模糊）。@Amijafari&Hossein:SO的问题、答案和评论必须是英文的。