JavaScript無操作后屏保功能的實(shí)現(xiàn)方法

更新時(shí)間：2017年07月04日 16:52:58 作者：YoungHong1992

今天組里的同事要寫一個(gè)屏保的效果，要求鼠標(biāo)無操作N秒后進(jìn)入屏幕保護(hù)，滑動(dòng)鼠標(biāo)的時(shí)候取消屏幕保護(hù)。我真是難倒了，糾結(jié)了半天，搞定了，下面給大家分享實(shí)現(xiàn)代碼

今天組里的同事要寫一個(gè)屏保的效果，要求鼠標(biāo)無操作N秒后進(jìn)入屏幕保護(hù)，滑動(dòng)鼠標(biāo)的時(shí)候取消屏幕保護(hù)。因?yàn)槭亲诰W(wǎng)頁上，所以用JavaScript簡(jiǎn)單實(shí)現(xiàn)了一下，記錄在此，代碼如下：

<html>
<head>
 <title>屏幕保護(hù)測(cè)試</title>
 <script type="text/javascript">
 var message ;//獲取p標(biāo)簽
 var t=setTimeout("delayTask()",3000);//延時(shí)3秒執(zhí)行延時(shí)任務(wù)
 //延時(shí)任務(wù)具體的操作
 function delayTask(){
  //延時(shí)后，在標(biāo)簽中顯示時(shí)間
  message.innerText= new Date();//此行替換為你要做的顯示操作
  clearTimeout(t);
 }
 //鼠標(biāo)移動(dòng)，重置延時(shí)任務(wù)
 function resetTask(){
  //重置標(biāo)簽中的內(nèi)容
  message.innerText = "";//此行替換為你要做的取消操作
  clearTimeout(t);
  t=setTimeout("delayTask()",3000);
 }
 //頁面加載時(shí)，加載函數(shù)。
 function loading(){
  message = document.getElementById("message");
  document.onmousemove = resetTask;
 }
 window.onload = loading;
 </script>
</head>
<body>
 <p>3秒無操作后顯示時(shí)間：</p>
 <p id="message"></p>
</body>
</html>

以上所述是小編給大家介紹的JavaScript無操作后屏保功能的實(shí)現(xiàn)方法，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

js 模擬氣泡屏保效果代碼

js
屏保

相關(guān)文章

js form 驗(yàn)證函數(shù) 當(dāng)前比較流行的錯(cuò)誤提示
js數(shù)據(jù)驗(yàn)證、js email驗(yàn)證、js url驗(yàn)證、js長(zhǎng)度驗(yàn)證、js數(shù)字驗(yàn)證等
2009-06-06
全面了解javascript三元運(yùn)算符
下面小編就為大家?guī)硪黄媪私鈐avascript三元運(yùn)算符。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-06-06
???????分享7?個(gè)實(shí)用?TypeScript?單行代碼
這篇文章主要介紹了???????分享7?個(gè)實(shí)用?TypeScript?單行代碼，其中包括泛型、斷言等高級(jí)用法，需要的小伙伴可以參考一下，希望對(duì)你的學(xué)習(xí)有所幫助
2022-05-05
js實(shí)現(xiàn)當(dāng)鼠標(biāo)移到表格上時(shí)顯示這一格全部?jī)?nèi)容的代碼
下面小編就為大家?guī)硪黄猨s實(shí)現(xiàn)當(dāng)鼠標(biāo)移到表格上時(shí)顯示這一格全部?jī)?nèi)容的代碼。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-06-06
基于Cesium繪制拋物弧線
這篇文章主要為大家詳細(xì)介紹了基于Cesium繪制拋物弧線，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-11-11
微信小程序?qū)崿F(xiàn)吸頂效果
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)吸頂效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-01-01
JavaScript 關(guān)于元素獲取焦點(diǎn)(隱藏元素與div)
關(guān)于元素獲取焦點(diǎn)要注意2個(gè)小問題，需要的朋友可以參考下。
2011-01-01
Vue指令的鉤子函數(shù)使用方法
這篇文章主要為大家詳細(xì)介紹了Vue指令的鉤子函數(shù)使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-03-03
mysql輸出數(shù)據(jù)賦給js變量報(bào)unterminated string literal錯(cuò)誤原因
mysql 數(shù)據(jù)庫數(shù)據(jù)賦給js變量報(bào)unterminated string literal錯(cuò)誤原因
2010-05-05
JavaScript伸縮的菜單簡(jiǎn)單示例
伸縮的菜單，想必大家都有見到過吧，實(shí)現(xiàn)方法也是很多的，在接下來的文章中為大家介紹下使用js是如何實(shí)現(xiàn)的，需要的朋友可以參考下
2013-12-12