在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5/ css 動(dòng)畫失效的問題

css 動(dòng)畫失效的問題

界面中需要一個(gè)彈窗，想做一個(gè)彈出時(shí)的動(dòng)畫效果，代碼如下

$(".modal_container").css({
    '-webkit-transform': 'scale(1.1)',
    '-ms-transform': 'scale(1.1)',
    'transform': 'scale(1.1)',
    '-webkit-transition-duration': '1.4s',
    'transition-duration': '1.4s',
    '-webkit-transition-timing-function': 'cubic-bezier(0.27, 1.12, 0.32, 1.5)',
    'transition-timing-function': 'cubic-bezier(0.27, 1.12, 0.32, 1.5)'
});

即做一下浮層彈窗的放大效果，有一個(gè)回彈的動(dòng)畫；在demo程序中同樣的代碼是可以的，但在我的程序中只有scale縮放效果，但動(dòng)畫的實(shí)現(xiàn)過程沒有，直接就變成了縮放的比例了！百思不得其解，不知有沒有人能提點(diǎn)建議？

回答
編輯回答
心沉

你這個(gè)是transition過渡，不是動(dòng)畫animation,當(dāng)然回不去阿

@keyframes change {
            0% {
                -webkit-transform: scale(1);
                -ms-transform: scale(1);
                transform: scale(1);
            }
            70% {
                -webkit-transform: scale(1.1);
                -ms-transform: scale(1.1);
                transform: scale(1.1);
            }
            100% {
                -webkit-transform: scale(1);
                -ms-transform: scale(1);
                transform: scale(1);
            }
        }        
$(".modal_container").css({animation: "change 1.4s linear"})
2017年8月14日 07:09
編輯回答
萌吟

缺少transition-property，動(dòng)畫不知道將要應(yīng)用到哪個(gè)屬性上。

加上transition-property:transform

2018年7月11日 04:48