制作動(dòng)態(tài)的網(wǎng)頁(yè)是是前端工程師必備的技能，很好的實(shí)現(xiàn)動(dòng)畫(huà)能夠極大的提高用戶體驗(yàn)，增強(qiáng)交互效果，那么動(dòng)畫(huà)有多少實(shí)現(xiàn)方式，一直對(duì)此有選擇恐懼癥的我就總結(jié)一下，以便在開(kāi)發(fā)的時(shí)候選擇最好的實(shí)現(xiàn)方式。

1.css的transition。

語(yǔ)法：

transition:    ;

property:填寫(xiě)需要變化的css屬性如：width,line-height,font-size,color等;
duration:完成過(guò)渡效果需要的時(shí)間（2s 或者2000ms）
timing-function:完成效果的速度曲線（linear,ease,ease-in,ease-out等等）

    <i id="slfud"></i>
    值描述
    linear勻速（等于 cubic-bezier(0,0,1,1)）。
    ease從慢到快再到慢（cubic-bezier(0.25,0.1,0.25,1)）。
    ease-in慢慢變快（等于 cubic-bezier(0.42,0,1,1)）。
    ease-out慢慢變慢（等于 cubic-bezier(0,0,0.58,1)）。
    ease-in-out先變快再到慢（等于 cubic-bezier(0.42,0,0.58,1)）。漸顯漸隱效果

    網(wǎng)友評(píng)論