Javascript 有没有办法排除规则和don'；不影响我的jQuery？

我的css中有以下规则：

* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-transition: all 0.6s ease-out;
    -moz-transition: all 0.6s ease-out;
    -ms-transition: all 0.6s ease-out;
    -o-transition: all 0.6s ease-out;
    transition: all 0.6s ease-out;
}

我有这个jquery效应：

$(document).ready(function(){
    $("#hide").click(function(){
        $("#entries").hide(400);
        $("#message").show(400);
    });
    $("#close").click(function(){
        $("#message").hide(400);
        $("#entries").show(400);
    });
});

---

当我按“#隐藏”时，#条目和#消息的显示和隐藏效果由于转换而被破坏。是否有一种方法可以排除该规则，并且仅对jQuery显示/隐藏没有影响？

您可以更改以下规则：

*:not(#message):not(#entries) {
  /* your rules here */
}

---

尝试从

css

规则中排除

active

类；在动画期间添加、删除

“活动”

类

css

js

---

是否可以在执行隐藏/显示之前专门重置转换属性？

   *:not(.active) {
        box-sizing: border-box;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-transition: all 0.6s ease-out;
        -moz-transition: all 0.6s ease-out;
        -ms-transition: all 0.6s ease-out;
        -o-transition: all 0.6s ease-out;
        transition: all 0.6s ease-out;
    }

$(document).ready(function(){
    var elems = $("#entries, #message");
    $("#hide").click(function(){
        elems.addClass("active");
        $("#entries").hide(400);
        $("#message").show(400, function() {
          elems.removeClass("active")
        });
    });
    $("#close").click(function(){
        elems.addClass("active");
        $("#message").hide(400);
        $("#entries").show(400, function() {
          elems.removeClass("active")
        });
    });