JavaScript无操作后屏保功能的实现方法


Posted in Javascript onJuly 04, 2017

今天组里的同事要写一个屏保的效果,要求鼠标无操作N秒后进入屏幕保护,滑动鼠标的时候取消屏幕保护。因为是坐在网页上,所以用JavaScript简单实现了一下,记录在此,代码如下:

<html>
<head>
 <title>屏幕保护测试</title>
 <script type="text/javascript">
 var message ;//获取p标签
 var t=setTimeout("delayTask()",3000);//延时3秒执行延时任务
 //延时任务具体的操作
 function delayTask(){
  //延时后,在标签中显示时间
  message.innerText= new Date();//此行替换为你要做的显示操作
  clearTimeout(t);
 }
 //鼠标移动,重置延时任务
 function resetTask(){
  //重置标签中的内容
  message.innerText = "";//此行替换为你要做的取消操作
  clearTimeout(t);
  t=setTimeout("delayTask()",3000);
 }
 //页面加载时,加载函数。
 function loading(){
  message = document.getElementById("message");
  document.onmousemove = resetTask;
 }
 window.onload = loading;
 </script>
</head>
<body>
 <p>3秒无操作后显示时间:</p>
 <p id="message"></p>
</body>
</html>

以上所述是小编给大家介绍的JavaScript无操作后屏保功能的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js的写法基础分析
Jan 17 Javascript
jQuery DOM插入节点操作指南
Mar 03 Javascript
javascript点击按钮实现隐藏显示切换效果
Feb 03 Javascript
javascript函数命名的三种方式及区别介绍
Mar 22 Javascript
基于JavaScript实现验证码功能
Apr 01 Javascript
js canvas实现放大镜查看图片功能
Jun 08 Javascript
JS实现不用中间变量temp 实现两个变量值得交换方法
Feb 04 Javascript
分析javascript原型及原型链
Mar 18 Javascript
微信小程序日期选择器实例代码
Jul 18 Javascript
微信小程序实现原生步骤条
Jul 25 Javascript
JS箭头函数和常规函数之间的区别实例分析【 5 个区别】
May 27 Javascript
JavaScript组合继承详解
Nov 07 Javascript
JS中type=&quot;button&quot;和type=&quot;submit&quot;的区别
Jul 04 #Javascript
5分钟打造简易高效的webpack常用配置
Jul 04 #Javascript
AngularJS实现表格的增删改查(仅限前端)
Jul 04 #Javascript
js CSS3实现卡牌旋转切换效果
Jul 04 #Javascript
JavaScript中三个等号和两个等号你了解多少
Jul 04 #Javascript
原生js实现简单的链式操作
Jul 04 #Javascript
详解用vue编写弹出框组件
Jul 04 #Javascript
You might like
php面向对象的方法重载两种版本比较
2008/09/08 PHP
讲解WordPress中用于获取评论模板和搜索表单的PHP函数
2015/12/28 PHP
linux mint下安装phpstorm2020包括JDK部分的教程详解
2020/09/17 PHP
js获取单选按钮的数据
2006/11/27 Javascript
js限制文本框输入长度两种限制方式(长度、字节数)
2012/12/19 Javascript
解决extjs grid 不随窗口大小自适应的改变问题
2014/01/26 Javascript
JavaScript前端图片加载管理器imagepool使用详解
2014/12/29 Javascript
ECMAScript6快速入手攻略
2016/07/18 Javascript
同步文本框内容JS代码实现
2016/08/04 Javascript
浅谈JSON.stringify()和JOSN.parse()方法的不同
2016/08/29 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
2016/09/17 Javascript
Bootstrap基本组件学习笔记之input输入框组(9)
2016/12/07 Javascript
整理关于Bootstrap模态弹出框的慕课笔记
2017/03/29 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
vue下的@change事件的实现
2019/10/25 Javascript
js键盘事件实现人物的行走
2020/01/17 Javascript
深入分析jQuery.one() 函数
2020/06/03 jQuery
利用vue3+ts实现管理后台(增删改查)
2020/10/30 Javascript
ant design的table组件实现全选功能以及自定义分页
2020/11/17 Javascript
python获取指定时间差的时间实例详解
2017/04/11 Python
Django 限制用户访问频率的中间件的实现
2018/08/23 Python
Python利用FFT进行简单滤波的实现
2020/02/26 Python
浅谈numpy中np.array()与np.asarray的区别以及.tolist
2020/06/03 Python
keras实现VGG16方式(预测一张图片)
2020/07/07 Python
城野医生官方海外旗舰店:风靡亚洲毛孔收敛水
2018/04/26 全球购物
小蚁科技官方商店:YI Technology
2019/08/23 全球购物
意大利辅助药品、药物和补品在线销售:FarmaEurope
2020/04/29 全球购物
大学毕业自我鉴定范文
2014/02/03 职场文书
新党章心得体会
2014/09/04 职场文书
企业挂职心得体会
2014/09/10 职场文书
信息与计算机科学职业规划范文:成为一艘有方向的船
2014/09/11 职场文书
机动车登记业务委托书
2014/10/08 职场文书
小学大队长竞选稿
2015/11/20 职场文书
2016领导干部廉洁自律心得体会
2016/01/13 职场文书
导游词之无锡梅园
2019/11/28 职场文书
python 字典和列表嵌套用法详解
2021/06/29 Python