用jquery給div添加transform動(dòng)畫(huà)沒(méi)有效果

1.做了一個(gè)動(dòng)畫(huà)效果是：點(diǎn)擊頁(yè)面按鈕，蒙層下拉覆蓋整個(gè)瀏覽器，并且蒙層上的按鈕添加一個(gè)打開(kāi)的動(dòng)畫(huà)效果，點(diǎn)擊按鈕再使蒙層上拉消失，同時(shí)按鈕狀態(tài)恢復(fù)原狀，也就是按鈕打開(kāi)關(guān)閉是一開(kāi)一合狀態(tài)，然后這個(gè)按鈕是做了兩個(gè)div也就是兩條線,同時(shí)向反方向轉(zhuǎn)45度形成一個(gè)x號(hào)。
2.代碼

var deg1 = 0;
var deg2 = 0;
$('.let-talk-btn').on('click',function () {
            //蒙層面板打開(kāi)以及添加動(dòng)畫(huà)類名
            $('.cover-info').css('display','block').addClass('height-extension');
            //使蒙層中的內(nèi)容出現(xiàn)
            $('.cover-content').css('display','block');
            deg2 += 45;
            deg1 -= 45;
            //加了一個(gè)定時(shí)器
            setTimeout(function () {
            //x號(hào)按鈕
            //一根線轉(zhuǎn)45度
                $('.close .left').get(0).style.transform="rotate(" + deg2 + "deg)";
                //另一根線轉(zhuǎn)-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.如果不加定時(shí)器，點(diǎn)擊按鈕蒙層出現(xiàn)后里面的x號(hào)按鈕是沒(méi)有動(dòng)畫(huà)效果的為什么？不是同步執(zhí)行的嗎？先出現(xiàn)蒙層再按鈕動(dòng)畫(huà)，（如果蒙層一直在那么不加定時(shí)器動(dòng)畫(huà)也是正常的，說(shuō)明蒙層打開(kāi)的那段代碼還沒(méi)執(zhí)行，x號(hào)的旋轉(zhuǎn)動(dòng)畫(huà)就執(zhí)行完畢了）

回答

編輯回答