css3元素簡單的閃爍效果(html5 jquery)


css3 Animation:

@-webkit-keyframes twinkling{ /*透明度由0到1*/
0%{
opacity:0; /*透明度為0*/
}
100%{
opacity:1; /*透明度為1*/

}
}

 

Jquery :

$(element).css({"-webkit-animation":"twinkling 1s infinite ease-in-out"}); //在對象element中添加閃爍動畫

 

也可以在css樣式里添加如下:

    #element{

          -webkit-animation: twinkling 1s infinite ease-in-out; 

 

 

     }

 注:動畫名稱為twinkling  時間為1s  動畫次數為無限次  動畫效果 ease-in-out 

http://www.cnblogs.com/roucheng/

 簡單吧!其實用css3做動畫效果,比用flash,javascript要方便簡單多了!希望瀏覽器趕快都支持css3 Animation .目前webkit內核的瀏覽器都支持(safrai,chrome)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM