最一開始還沒進網站的水滴畫面，
第二個水滴畫面，是一張png的圖，不知道是css動畫還是jquery？
和後面的年份圓圈翻過來，
要怎麼做出類似的？
目前只知道一開始有load 4個js檔進來
http://www.taiyeng.com.tw/en/about
謝謝~~

水滴的部分跑太快看不出來，倒是下面年度圓圈年度(css:border-radius:50%,X軸-100deg)，然後scroll到特定位置時，script加入css aos-animate rule，在1.2秒內x軸翻正

把body下第一個div元素的pace-inactive改成pace-active就可以讓動畫一直播~ 然後他的原理很簡單, 水滴落下跟飛濺效果看成兩個部分上半部只是一個裝著水滴圖片的element讓他不斷執行落下並透明化的動畫下半部則是水花飛濺的動畫, 兩者時間上搭配好就可以了實際上這個例子好像是用jQuery的動畫+paeudo element一個簡單的demo會像這樣 https://tinyurl.com/y7vy8nxq那個網站水滴落下後的飛濺效果則是透過border-radius畫的橢圓這些都可以在pace-active裡面的裡面的pace-progress元素觀察到更正,好像不是jQuery動畫, 就一樣是css keyframes