快速且不用Coding的製作CSS3動畫:cssanimate

在图形界面上制作CSS3动画:cssanimate

CSS3已經很強大,可以實現很多漂亮的動畫,但寫起來很麻煩,一個動畫有時候會調整幾十分​甚至幾小時​鐘,改一點點代碼又要到瀏覽器上刷新,這是個很討厭的事情( 除非你livereload )。

 

幸運的是,cssanimate在線工具解決了我們的問題,最大特色就是以圖形界面方式讓你輕易實現漂亮的CSS3動畫效果,下面一起看看這個在線工具的介紹。

 

CSS3動畫製作工具界面介紹

– Timeline是引導動畫的重要區域,就像製作逐幀動畫一樣,可以調整每幀的內容。用戶調整完畢後,直接點擊左下角的播放按鈕即可看到效果。

 

– 視區就是CSS3動畫預覽和調整區域,所見即所得,很強大。

 

– 屬性面板用於調整動畫細節參數,可以對關鍵幀進行更精細的調整,如時間、旋轉、重複次數等。

 

– Code面板當你調整完動畫後,那麼就在這裡直接COPY到你的網頁上就能使用了,另外你還可以修改Class和Animation名稱,還有瀏覽器前綴選項,根據需求調整。

 

這確實是一個很方便的CSS3動畫在線製作工具,即使對CSS代碼不太了解的設計師們也可以輕鬆實現一個漂亮的動畫效果出來

 

工具 : cssanimate

網址 : http://cssanimate.com/

 

 

( 如果覺得DR文章不錯,趕快分享給你的親朋好友們啊!!~~~ )

 

廣告

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com Logo

您的留言將使用 WordPress.com 帳號。 登出 / 變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 / 變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 / 變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 / 變更 )

連結到 %s