用jquery给div添加transform动画没有效果

Question

1.做了一个动画效果是：点击页面按钮，蒙层下拉覆盖整个浏览器，并且蒙层上的按钮添加一个打开的动画效果，点击按钮再使蒙层上拉消失，同时按钮状态恢复原状，也就是按钮打开关闭是一开一合状态，然后这个按钮是做了两个div也就是两条线,同时向反方向转45度形成一个x号。2.代码var deg1 = 0;var deg2 = 0;$('.let-talk-btn').on('click',function () {            //蒙层面板打开以及添加动画类名            $('.cover-info').css('display','block').addClass('height-extension');            //使蒙层中的内容出现            $('.cover-content').css('display','block');            deg2 += 45;            deg1 -= 45;            //加了一个定时器            setTimeout(function () {            //x号按钮            //一根线转45度                $('.close .left').get(0).style.transform="rotate(" + deg2 + "deg)";                //另一根线转-45度                $('.close .right').get(0).style.transform="rotate(" + deg1 + "deg)";            },10)        })css:transition: transform 0.3s ease-in-out;    -moz-transition: transform 0.3s ease-in-out;    -webkit-transition: transform 0.3s ease-in-out;    -o-transition: transform 0.3s ease-in-out;3.如果 不 加定时器，点击按钮蒙层出现后里面的x号按钮是没有动画效果的为什么？不是同步执行的吗？先出现蒙层再按钮动画，（如果蒙层一直在那么不加定时器动画也是正常的，说明蒙层打开的那段代码还没执行，x号的旋转动画就执行完毕了）