简单的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收藏了 此素材
刁民下载了 此素材
ID666275收藏了 此素材
雉机化下载了 此素材
莣汜.下载了 此素材
大偉下载了 此素材
ldqwan_收藏了 此素材
尚易致诚科技收藏了 此素材

也许你还喜欢

  1. js模拟时钟带文本标签
  2. js简约设计时钟网页特效代码
  3. jquery旋转动画时钟特效代码
  4. 时尚的立体样式动态时钟
  5. 中国风动态时钟Js代码
  6. 很酷的时钟样式特效
  7. three.js蓝色时钟走动
  8. html5时钟闹铃特效代码
canvas在图片上画路径裁剪
  • 标签查找|关于我们|用户协议|格式化工具|bootstrapmb.com 版权所有
  • 背景样式编辑器|按钮样式编辑器|背景动效编辑器|图片布局编辑器