早就有做一个自适应时钟的打算,虽然网上也趴了不少代码,但总是没法做到随意使用。
昨晚闲来无事,就用AI来做一个吧。
还是用的腾讯元宝,deepseek模型。
提问过程
一问:用js做一个简易有指针的时钟,并自适应父元素大小
二问:修复此js错误,表现在指针到达0时会反向旋转1周,另外表盘刻度错位
三问:指针还是会往回转
四问:修改后指针不动了
五问:上面的优化无效,表盘刻度在圆心附近,没有到表盘边缘
六问:现在表盘刻度全部位于12点了
七问:现在表盘刻度全部位于6点了,且在圆心处
八问:刻度正常了,但重新回到以前的状态也就是刻度在圆心处
九问:(截图后)刻度偏移成了上面的图片式样
新建对话,复制代码
问:请帮我修复此代码错误:表盘错位
手动修正
无论怎么样提问,刻度总是无法修正, 这次 AI 在处理 CSS 尤其是 transform 这个样式时有点差强人意啊。于是只好边学边用边测试,最后总算是解决了表盘问题!
这个时钟怎么样,只要引用 1 个 js,任意地方通过一个包含 clock-container
类的 div 来调用,大小(不能小到看不见)随意设置。
<script src="https://demo.hollowman.cn/clock/clock.js"></script>
<div class="clock-container" style="width: 300px;height: 300px;margin:auto"></div>
是不是换主题了,我感觉感觉突然博客的整体界面变得漂亮了,还是我记错了,时空很漂亮,有时间我也搞点挂件放在博客。
没换,只是有些细节一直在调整。
我付费chatgpt 2 年了,这些AI已经成了日常的一部分~
虽久闻其大名,可惜没付费享受不到AI带来的福利,而今百家争鸣,我恰好有点机会接触接触,哈哈。
让我想起了以前用zibll主题时弄的华为太空手表,刚才用必应搜索一下zibll太空,都没有注意以前的文章被转载多次了。那个手表高仿华为表盘,当时喜欢的不得了。
我也搜了一下,表盘确实很漂亮,功能也很丰富,估计需要不少API的配合。
不需要API,就是一个简单的html代码加图标。
有时间也去研究一下,可能会用得上 😀
这个时钟不错,很漂亮
可以考虑继续完善 到番茄钟 然后魔方定时器啥的
时间确实到处显示,家里买了那种便宜的湿度温度时间都显示的,每个屋放一个,确保抬头就看到时间。唯一忽略的就是忘记买那种wifi同步时间的,不然每个屋子的时间都不同。还得手动调。
主要目的是给网站装饰一下
你准备把它放在哪里呢?
已经放上去了,您找找看 🤭
想法不错。。。
已经放到右边了,顺便又撸了一个强大的 Tyme 日历库 🤡
这个可以有相当不错我也准备整一个哈哈
这个时钟可以,就是得好好琢磨下怎么应用起来。
我正打算弄一个日期,然后将两个组件一起放到 sidebar 上。