有時(shí)候一些細(xì)微的交互動(dòng)畫能提升一定的用戶體驗(yàn)，以前我們可能需要用JS才可實(shí)現(xiàn)，但CSS3的出現(xiàn)大大方便了我們，下面我們整理下些用CSS實(shí)現(xiàn)的交互動(dòng)畫按鈕和菜單，我想會(huì)給你帶來一些靈感。

對(duì)此也建議大家看看原代碼的編寫方法，這些都是比較實(shí)用的效果，舉一反三，你可以用它來實(shí)現(xiàn)更多創(chuàng)新的交互。

提交按鈕效果
 

在線演示
Google Play商店菜單特效
 

在線演示
焦點(diǎn)動(dòng)畫
 

在線演示
社會(huì)化媒體分享動(dòng)畫
 

在線演示
CSS Tooltips效果
 

在線演示
CSS左側(cè)菜單動(dòng)畫
 

在線演示
發(fā)送、確認(rèn)動(dòng)畫
 

在線演示
郵件提示效果
 

在線演示
展開菜單效果
 

在線演示
鼠標(biāo)Hover動(dòng)畫
 

在線演示
CSS按鈕單擊特效
 

在線演示
展示開單按鈕動(dòng)畫
 

在線演示