跳至主要內容
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?

4563博客

全新的繁體中文 WordPress 網站
  • 首頁
  • 写了个显示今天剩余时间的进度条
未分類
15 5 月 2020

写了个显示今天剩余时间的进度条

写了个显示今天剩余时间的进度条

資深大佬 : tiaod 4

写了个显示今天剩余时间的进度条

以起床时间开始,睡觉时间结束(默认是 9:00~22:00 ),让你直观感受时间流逝,把握时间完成工作,从而按时睡觉。

之所以写这个,是因为找了很多个显示时间进度条的项目都不满足我的需求,那些项目都是统计 0:00~24:00 的,容易给人晚上时间很多的错觉,从而习惯熬夜。

在线 DEMO

推荐使用Wallpaper engine或者lively之类的工具设置为桌面背景。

看着时间像手机电池电量一样减少,感觉是很奇妙的。

github 地址: https://github.com/tiaod/day-progress

大佬有話說 (37)

  • 資深大佬 : leeUp

    警告!你正在透支明天!哈哈哈哈挺有创意的

  • 資深大佬 : hikaruchang

    -1 -1 -1 -1 …

  • 資深大佬 : XBlackBerry

    -1s

  • 資深大佬 : Smash

    有 bug,还是特意的?进度条会超过百分之百

  • 資深大佬 : liuy1994g

    @Smash 透支了啊

  • 資深大佬 : liuy1994g

    有没有环形的呀

  • 資深大佬 : leetao94

    点击访问~ 403

    403 Forbidden
    Code: AccessDenied
    Message: You are denied by bucket referer rule
    Key: day-progress/index.html
    RequestId: NWViNzRhNzVfMWNiMjk0MGFfNmVmZl8yNDkxZTMw
    TraceId: OGVmYzZiMmQzYjA2OWNhODk0NTRkMTBiOWVmMDAxODc0OWRkZjk0ZDM1NmI1M2E2MTRlY2MzZDhmNmI5MWI1OTQ5YWUxMjNkYTk3NzdjZmZlMDQzOTgxOThkOTNlOWFkZjBjZjY5OGU2ZTBmZWM0MmE4YjI2OWU3YjQ2YTU5NTM=

  • 主 資深大佬 : tiaod

    @Smash 默认是 9:00~22:00,在 9:00 之前打开就会超过 100%,点击设置按钮可以调节时间。

  • 資深大佬 : leetao94

    ~~能正常访问了,这个和那个人生进度一样~看了引起不适

  • 資深大佬 : hst001

    @XBlackBerry #3 几年前写的一个 chrome 主页插件就叫 -1s,现在不知道还能不能搜到了

  • 主 資深大佬 : tiaod

    @liuy1994g 环形的进度条已添加,点击设置就可以切换啦。如果有缓存就强制刷新一下

  • 資深大佬 : deyilee

    作为桌面非常棒!求教怎么在 wallpaper 上设置

  • 主 資深大佬 : tiaod

    @deyilee 可以用 wallpaper engine,不过我推荐开源的 lively,地址:
    https://github.com/rocksdanister/lively

    直接将在线 demo 的地址填进去就可以了: https://hacker-mu.uvcat.com/day-progress/

  • 資深大佬 : fxt0706

    摸了一会鱼感觉没过多久,发现时间少了 1%,太真实了

  • 資深大佬 : windplume

    方向是不是反了

  • 資深大佬 : Vie

    打开一看,一股压力莫名袭来

  • 資深大佬 : huyudong1991

    php 版本就好了

  • 主 資深大佬 : tiaod

    @windplume 要的就是这种血条减少一样的效果

    @huyudong1991 纯前端的,要 php 干啥

  • 資深大佬 : cedoo22

    可以加个 背景设置功能

  • 資深大佬 : zhao1014

    设置成背景了,非常有用,我正需要这个!谢谢分享!

  • 資深大佬 : hugsky

    PS 了一个进度示意,不知是否有软件能实现类似效果。

    https://i.loli.net/2020/05/10/6QB72Eng19jbrRl.jpg

  • 資深大佬 : eptwd

    每天都这么焦虑了,这么搞像是在逼死自己。不如做一个周末倒计时。

  • 資深大佬 : whywhywhy

    奇怪,我显示器在这块深灰色的图片区域,会一闪一闪的。。。

  • 資深大佬 : lithbitren

    半夜看到这个真 jb 焦虑

  • 資深大佬 : c0xt30a

    考虑下时区吧

  • 資深大佬 : ares586

    不错的工具,放在工位上了~

  • 資深大佬 : Artbox

    1 默认是 9:00~22:00,在 9:00 之前打开就会超过 100%,点击设置按钮可以调节时间。理解。
    2 设置成 23:00-22:00,显示 1 天 ,应该是 23:00-次日 22:00,理解
    3 设置成 23:00-22:00,在 12:00 打开超过 100% ?这个进度条认为我在 23:00 前打开?而不是在 10:00 结束前还有 50%?
    4 设置成 23:00-22:00,在 日期+1 1:00 打开,显示 2 天 ?
    时 间 刺 客
    猜测实现的逻辑是判断 开始时间之前 而不是 较早时间之前
    时间刺客 2.0

  • 主 資深大佬 : tiaod

    @cedoo22 背景设置,这个可以有,但是我得看看怎么加,因为是纯前端的,看看怎么样把图片保存到前端

    @hugsky Mac 开发我不会,我只是个前端

    @c0xt30a 应该不存在时区问题吧,直接读取浏览器时间来计算的。

  • 主 資深大佬 : tiaod

    @Artbox 是有点问题,其实算这个我也绕的有点晕,我看看怎么样完善一下

  • 資深大佬 : zhangbohun

    希望支持 url 参数配置,不然用做壁纸每次重启以后都会变回初始的设置,lively 好像不能保持 localstorage?

  • 資深大佬 : SuckCat

    @XBlackBerry 5 月名单加急!!

  • 資深大佬 : c2boy

    设置成 9 点到 5 点半就能知道还有多久下班了

  • 資深大佬 : stevenkang

    感谢分享。下班倒计时 get

  • 資深大佬 : baozhuo

    借你的实现了一个微信小程序版的,搜“今日倒计时”可以看到

  • 資深大佬 : TPOB

    我这边 403 forbidden 诶

  • 資深大佬 : yesqu

    厉害啊!!!感谢分享,开个脑洞,如果要是可以在标题栏常驻或者 toolbar 上常驻应该效果很高吧!先挖个坑,等大神

  • 主 資深大佬 : tiaod

    @cedoo22 背景设置支持了,不过目前只支持填写图片地址,有自定义需求的话可以找图床上传图片。另外还支持了设置进度条的颜色。

    @zhangbohun 参数配置保存到 url 也支持了,现在可以在网页里设置好再复制到 lively 啦。

    @c2boy
    @stevenkang 哈哈,也是不错的用法

    @baozhuo 兄弟你这个也是统计 0~24 点的,我找过很多类似的,也都是不支持自定义时间,没办法了才动手写这个的呀。

    @TPOB 刷新下试试?还不行的话我 github pages 也传一份吧。目前是放在腾讯云的 cos

文章導覽

上一篇文章
下一篇文章

AD

其他操作

  • 登入
  • 訂閱網站內容的資訊提供
  • 訂閱留言的資訊提供
  • WordPress.org 台灣繁體中文

51la

4563博客

全新的繁體中文 WordPress 網站
返回頂端
本站採用 WordPress 建置 | 佈景主題採用 GretaThemes 所設計的 Memory
4563博客
  • Hostloc 空間訪問刷分
  • 售賣場
  • 廣告位
  • 賣站?
在這裡新增小工具