简单的js动态时钟效果

简单的js动态时钟效果源码下载

看看谁在用

查看文件目录结构

文件大小:0.02M

素材分类: 插件- 时间

更新时间:2023-11-24

原生态js动态时钟效果,时钟的还盘是图片当背景,指针的代码写的。
const run = () => {
        const date = new Date()
        const seconds = date.getSeconds()
        const minute = date.getMinutes()
        let hours = date.getHours()
        if (hours >= 12) {
            hours -= 12
        }
        const hoursEl = document.querySelector('.hours')
        const minuteEl = document.querySelector('.minute')
        const secondsEl = document.querySelector('.seconds')

        hoursEl.style.transform = `rotate(${(hours + minute / 60) * 30}deg) translateY(-35px)`
        minuteEl.style.transform = `rotate(${(minute + seconds / 60) * 6}deg) translateY(-35px)`
        secondsEl.style.transform = `rotate(${seconds * 6}deg) translateY(-35px)`
    }
    run()
    setInterval(() => {
        run()
    })

简单的js动态时钟效果

正在加载文件目录...

 雾、
雾、下载了 此素材
红尘
红尘下载了 此素材
微笑刺客
微笑刺客下载了 此素材
天天向上
天天向上下载了 此素材
MyTone
MyTone收藏了 此素材
刁民
刁民下载了 此素材
ID666275
ID666275收藏了 此素材
雉机化
雉机化下载了 此素材
莣汜.
莣汜.下载了 此素材
大偉
大偉下载了 此素材

也许你还喜欢

  1. 时尚的立体样式动态时钟
  2. 动态时钟JavaScript特效
  3. three.js蓝色时钟走动
  4. js模拟时钟带文本标签
  5. 翻卡片计时器js插件
  6. 中国风动态时钟Js代码
  7. 纯css蓝色动态时钟特效
  8. jQuery圆形时钟插件
canvas在图片上画路径裁剪
  • 标签大全|网站地图|关于我们|用户协议
  • 背景样式编辑器|按钮样式编辑器|背景动效编辑器|图片布局编辑器|在线工具