JavaScript实现微信小程序打卡时钟项目实例

发布时间:2023-03-14 11:00

目录
  • 一、项目展示
  • 二、首页
  • 三、设置
  • 文末:项目代码

一、项目展示

这是一款简单实用的小时钟工具

分为工作和休息两种状态

用户可以设置相应的时间

所有的时钟记录都会被保存下来

\"JavaScript实现微信小程序打卡时钟项目实例_第1张图片\"

二、首页

首页由计时器、任务输入框和两个计时按钮组成


	
		 
		 		
		 		
		 			
		 		
		 		
		 			
		 		
			 	{{remainTimeText}}
			 	{{taskName}}{{completed ? \'已完成!\' : \'中\'}}
		 		
		 
		 
	
	
	  {{isRuning ? \'完成\': \'工作\'}}
	  {{isRuning ? \'完成\': \'休息\'}}
	

效果图如下:

三、设置

用户在设置界面可以更改工作时长和休息时长


	
	  工作时长(分钟)
	  
	    
	  
	
	
	  休息时长(分钟)
	  
	    
	  
	
	
	  
	  	主页背景
	  
	  
	  	选择背景 > 
	  
	
	
	  
	  	
	  	启用铃声
	  
	  
	  	选择铃声 > 
	  
	

效果图如下:

\"JavaScript实现微信小程序打卡时钟项目实例_第2张图片\"

文末:项目代码

点击下载

以上就是JavaScript实现微信小程序打卡时钟项目实例的详细内容,更多关于JavaScript微信小程序打卡时钟的资料请关注脚本之家其它相关文章!

ItVuer - 免责声明 - 关于我们 - 联系我们

本网站信息来源于互联网,如有侵权请联系:561261067@qq.com

桂ICP备16001015号