css过渡停止工作 - 两天前工作

Question

这可能是非常明显的事情，但我迷失了。几天前工作正常 - 没有代码更改。

我有一个容器div，当一个类用jquery切换时，它会下降，我试图让它上下转换再次工作。

I类切换仅改变高度宽度和位置。任何负值都是与页面上的其他div关闭小间隙。

＆＃13;

＆＃13;

  $(".me").click(function() {

   if ( $("#ballHolder").hasClass("shown") ) {
      $("#ballHolder").removeClass("shown");
	  } else {

	    $( "#ballHolder" ).addClass( "shown" );
	  }
      $(".foo").fadeToggle("fast");
    // note I am new to JS and JQ //
  });

＆＃13;

.shown {
  top: -30px; !important
  height: 300px; !important
  width: 380px; !important
  -webkit-transition: all,400ms,ease-in-out;
  -moz-transition: all,400ms,ease-in-out;
  -ms-transition: all,400ms,ease-in-out;
  -o-transition: all,400ms,ease-in-out;
  transition: all,400ms,ease-in-out;
}
#ballHolder {
  max-width: 480px !important
  height: 105px;
  width: 150px;
  display: block;
  position: absolute;
  margin: 0 auto;
  top: -1px;
  right: 0;
  bottom: auto;
  left: 0;
  
  -webkit-transition: all,400ms,ease-in-out;
  -moz-transition: all,400ms,ease-in-out;
  -ms-transition: all,400ms,ease-in-out;
  -o-transition: all,400ms,ease-in-out;
  transition: all,400ms,ease-in-out;

  @include abs-pos($top: -1px, $right: 0, $left: 0)
  @include transition(all, 400ms, ease-in-out)

  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
  
  background-color: grey;
  overflow: hidden;
  }

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


  <div class="profile">
    <div class="me"> 

      <div id="ballHolder">
        <!-- there are items in here, code for them works fine -->
          
    </div>
  </div>

＆＃13;

＆＃13;

＆＃13;

Answer 1

转型中没有逗号，谢谢托比。

Answer 2

我在所有的东西中使用逗号一段时间，它完美地工作，然后，不再工作......谢谢......