廢話一籮筐,筐筐有心得
不小心養成了一個刷微博的習慣,主要還是關注一些前端人士,學習一些前端方面的知識,看到大家都有一些刷微博的小習慣。有的是轉發一下,轉發內容來一個標記(MARK).也有評論中標記為Mark的,這種完全不知道是干什么?不過有一個比較好的@我的印象筆記 不過,我不怎么喜歡使用這些小工具,因為怎么的我都不喜歡詳細看,實際上這不是一個好習慣,我最常用的還是微博的收藏功能,最后找個時間再細看一下這些內容,今天就分享一篇收藏的內容。(吐槽一下:微博的某設備官方客戶端真心不好用,主要是針對我常用的收藏功能)
時間感知的算法驅動的圖標陰影JS庫 - Four Shadows Demo
英文不是很好,使用的谷歌翻譯,大致理解的是根據一天中的時間,并根據模擬時鐘的“時針”的方向上陰影的方向變化。
Four Shadows Demo
Current Hour:
Simulate TimeDirection of shadow is based on direction of 'hour hand' on an analog clock.
setup
①:引入fourshadows.js
②:body中寫上這么一個div:>div class="fs-icon-l fs-cast" data-icon="filename.png"$lt;>/div<
③:引入css樣式:
.fs-icon-l {width: 512px; height: 512px;}
.fs-icon-m {width: 256px; height: 256px;}
.fs-icon-s {width: 128px; height: 128px;}
.fs-icon-xs {width: 64px; height: 64px;}
④:配置一下默認JS設置
②:body中寫上這么一個div:>div class="fs-icon-l fs-cast" data-icon="filename.png"$lt;>/div<
③:引入css樣式:
.fs-icon-l {width: 512px; height: 512px;}
.fs-icon-m {width: 256px; height: 256px;}
.fs-icon-s {width: 128px; height: 128px;}
.fs-icon-xs {width: 64px; height: 64px;}
④:配置一下默認JS設置
參考DEMO以及Github開源
https://github.com/Gigacore/four-shadows
http://gigacore.github.io/demos/fs/
http://gigacore.github.io/demos/fs/