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 相关文章推荐
点击文章内容处弹出页面代码
Oct 01 Javascript
HTML页面登录时的JS验证方法
May 28 Javascript
JS判断是否360安全浏览器极速内核的方法
Jan 29 Javascript
javascript实现获取浏览器版本、浏览器类型
Dec 02 Javascript
jquery easyui如何实现格式化列
Jul 30 jQuery
javascript中的隐式调用
Feb 10 Javascript
使用vue-cli webpack 快速搭建项目的代码
Nov 21 Javascript
JS+CSS3实现的简易钟表效果示例
Apr 13 Javascript
使用layui的router来进行传参的实现方法
Sep 06 Javascript
layui实现多图片上传并限制上传的图片数量
Sep 26 Javascript
js实现复制粘贴的两种方法
Dec 04 Javascript
基于JavaScript实现简单的轮播图
Mar 03 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提示undefined index的几种解决方法
2012/05/21 PHP
使用php验证复选框有效性的示例
2013/11/13 PHP
实现PHP框架系列文章(6)mysql数据库方法
2016/03/04 PHP
php简单复制文件的方法
2016/05/09 PHP
php获得文件夹下所有文件的递归算法的简单实例
2016/11/01 PHP
一个分享按钮的插件使用介绍(可扩展,内附开发制作流程)
2011/09/19 Javascript
javascript将数组插入到另一个数组中的代码
2013/01/10 Javascript
下载文件个别浏览器文件名乱码解决办法
2013/03/19 Javascript
jquery 字符串切割函数substring的用法说明
2014/02/11 Javascript
JavaScript将当前时间转换成UTC标准时间的方法
2015/04/06 Javascript
老生常谈JavaScript数组的用法
2016/06/10 Javascript
jQuery事件委托之Safari
2016/07/05 Javascript
Html5+jQuery+CSS制作相册小记录
2016/12/30 Javascript
bootstrap输入框组使用方法
2017/02/07 Javascript
详解vuejs之v-for列表渲染
2017/06/22 Javascript
详解开源的JavaScript插件化框架MinimaJS
2017/10/26 Javascript
原生JavaScrpit中异步请求Ajax实现方法
2017/11/03 Javascript
JavaScript图片处理与合成总结
2018/03/04 Javascript
JavaScript设计模式之构造器模式(生成器模式)定义与用法实例分析
2018/07/26 Javascript
小程序tab页无法传递参数的方法
2018/08/03 Javascript
如何修改Vue打包后文件的接口地址配置的方法
2020/04/22 Javascript
Vue 封装防刷新考试倒计时组件的实现
2020/06/05 Javascript
react ant Design手动设置表单的值操作
2020/10/31 Javascript
python网络编程学习笔记(四):域名系统
2014/06/09 Python
Django如何实现密码错误报错提醒
2020/09/04 Python
CSS3圆角和渐变2种常用功能详解
2016/01/06 HTML / CSS
在C语言中"指针和数组等价"到底是什么意思?
2014/03/24 面试题
override和overload的区别
2016/03/09 面试题
毕业生找工作推荐信
2013/11/21 职场文书
竞选班长演讲稿
2013/12/30 职场文书
优秀毕业生自荐信
2014/06/10 职场文书
教师拔河比赛广播稿
2014/10/14 职场文书
离婚协议书范文2014(夫妻感情破裂)
2014/12/14 职场文书
入伍通知书
2015/04/23 职场文书
2015年客房服务员工作总结
2015/05/15 职场文书
三严三实学习心得体会(精选N篇)
2016/01/05 职场文书