自助建站、網頁設計教程

通過學習路線圖,零基礎學習專業網頁設計、小程序UI設計技巧,成就網頁設計高手。

自定義代碼:對動效進行控制

小例子:用自定義class實現圖片旋轉。

得益于css3強大的動畫庫,coolsite360也把它們引入使用,使得建站更自由、更得心應手。

具體css3動畫庫解析,點擊可參考:animation動畫庫解析

下面我們通過coolsite360來實現這樣一個小例子。


1.先給圖片默認樣式加CSS3語句。
animation: rotate 10s linear infinite ;

 

2.給圖片自定義一個class為imgRotate。里面寫控制動效暫停的CSS3代碼。

 

3.給button設置觸發器讓圖片切換class,得到以下效果。

 

4.預覽效果,更多CSS3玩法等你來試。

提交成功,謝謝反饋!

請完整填寫表單的信息后,再進行提交!

手机棋牌平台 河北体彩11选5 免费下载欢乐斗地主 广东快乐十分预测 天天捕鱼电玩城送分 揭阳市滴滴代驾赚钱么 微信交易单号尾数技巧 更恐怖嘉年华 必中pk10全能计划 魔域牛牛版下载地址 开货车运石子赚钱吗 高手揭秘后三组选包胆规则 AG日本武士开奖 四川时时怎么玩 西游争霸决战天下 军团再临wow如何赚钱 彩工网崔晓龙快3早知道