js animation-velocity筆記( 持續更新 ) - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0

js animation-velocity筆記( 持續更新 )

js動畫 velocity

dc88 2019-01-02 16:12:23 ‧ 940 瀏覽

分享至

一般寫法

 $("elementName").velocity({
    translateX: "Xpx",
    translateY: "Xpx",
    opacity: 0
    rotateZ: "0deg" // 旋轉角度 rotateZ:["目標deg","緩動速率","初始deg"]
  },{
    loop:true, // 等同於 css animation:infinite
    ease:"easeOut", // 緩動速率
    duration:500 // 延遲時長 以ms為單位
  });
});

reverse
針對最後一步做倒轉

$("elementName").velocity("reverse");

官方文件
http://velocityjs.org/

可參考的線上影片資源
https://www.youtube.com/watch?v=MDLiVB6g2NY

直播研討會

{{ item.subject }}

{{ item.channelVendor }} {{ item.webinarstarted }} |

{{ formatDate(item.duration) }}

直播中

尚未有邦友留言

立即登入留言

參賽組數

1064 組

團體組數

40 組

累計文章數

22195 篇

完賽人數

600 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙