javascript延時(shí)重復(fù)執(zhí)行函數(shù) lLoopRun.js
更新時(shí)間:2007年06月29日 00:00:00 作者:
function lLoopRun(sFuncLoop,sFuncEnd,nDelay) {
//writen by http://fengyan.iecn.cn
//sFuncLoop >> 字符串型,需要重復(fù)執(zhí)行的Javascript函數(shù)或語句(多個(gè)函數(shù)或語句請用;分隔)
//sFuncEnd >> 字符串型,用于中止重復(fù)執(zhí)行動(dòng)作(sFuncLoop)的Javascript函數(shù)或語句
//nDelay >> 數(shù)字型,重復(fù)執(zhí)行的時(shí)間間隔(毫秒數(shù))
var vintervalId = null;
var runString = sFuncLoop;
var stopString = sFuncEnd;
var delayTime = nDelay;
//var nCount = 0;//執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
this._doLoop = function (){
if (vintervalId && !eval(stopString)){
eval(runString);
//nCount++;//記錄執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
} else {
window.clearInterval(vintervalId);
vintervalId = null;
}
//document.getElementById("TestCount").innerHTML = nCount;//輸出執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
}
window.clearInterval(vintervalId);
vintervalId = window.setInterval(this._doLoop,delayTime);
}
幾個(gè)實(shí)例代碼:
水平往復(fù)運(yùn)動(dòng):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:水平往復(fù)運(yùn)動(dòng)</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.left = (parseInt(o.style.left)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.left)<0){isReBack = false;}
if(parseInt(o.style.left)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,600)",20);
-->
</script>
</body>
</html>
自動(dòng)伸縮大小:
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:自動(dòng)伸縮大小</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.width = (parseInt(o.width)+n);
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.width)<10){isReBack = false;}
if(parseInt(o.width)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.left)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,500)",20);
-->
</script>
</body>
</html>
垂直往復(fù)運(yùn)動(dòng):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:垂直往復(fù)運(yùn)動(dòng)</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.top = (parseInt(o.style.top)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.top)<0){isReBack = false;}
if(parseInt(o.style.top)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.top)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,300)",20);
-->
</script>
</body>
</html>
漸變顯示(圖片):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例: 漸變顯示效果</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
body{background:#080;color:#fff;}
#IECN {
background:#fff;
filter: Alpha(opacity=10);
-moz-opacity:.10;
opacity:.10;
}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" /><br /><br />刷新再次查看演示效果
<script type="text/javascript">
<!--
function chgOpacity(sId,n){
var o = document.getElementById(sId);
if (o.filters) {
o.filters[0].Opacity = parseInt(o.filters[0].Opacity) + n;
} else {
o.style.opacity= eval(document.defaultView.getComputedStyle(o,null).getPropertyValue(opacity)) + (n*100/10000);
}
}
function chgOpacityStop(sId){
var o = document.getElementById(sId);
if (o.filters) {
return parseInt(o.filters[0].Opacity)>=99;
} else {
return eval(o.style.opacity)>=0.99;
}
}
lLoopRun("chgOpacity(IECN,1);","chgOpacityStop(IECN)",20);
-->
</script>
</body>
</html>
原文:http://fengyan.iecn.cn/blog-html-do-showone-uid-35653-type-blog-itemid-2320.html
//writen by http://fengyan.iecn.cn
//sFuncLoop >> 字符串型,需要重復(fù)執(zhí)行的Javascript函數(shù)或語句(多個(gè)函數(shù)或語句請用;分隔)
//sFuncEnd >> 字符串型,用于中止重復(fù)執(zhí)行動(dòng)作(sFuncLoop)的Javascript函數(shù)或語句
//nDelay >> 數(shù)字型,重復(fù)執(zhí)行的時(shí)間間隔(毫秒數(shù))
var vintervalId = null;
var runString = sFuncLoop;
var stopString = sFuncEnd;
var delayTime = nDelay;
//var nCount = 0;//執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
this._doLoop = function (){
if (vintervalId && !eval(stopString)){
eval(runString);
//nCount++;//記錄執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
} else {
window.clearInterval(vintervalId);
vintervalId = null;
}
//document.getElementById("TestCount").innerHTML = nCount;//輸出執(zhí)行次數(shù)//為便于測試,應(yīng)用時(shí)就將此行注釋掉
}
window.clearInterval(vintervalId);
vintervalId = window.setInterval(this._doLoop,delayTime);
}
幾個(gè)實(shí)例代碼:
水平往復(fù)運(yùn)動(dòng):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:水平往復(fù)運(yùn)動(dòng)</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.left = (parseInt(o.style.left)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.left)<0){isReBack = false;}
if(parseInt(o.style.left)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,600)",20);
-->
</script>
</body>
</html>
自動(dòng)伸縮大小:
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:自動(dòng)伸縮大小</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.width = (parseInt(o.width)+n);
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.width)<10){isReBack = false;}
if(parseInt(o.width)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.left)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,500)",20);
-->
</script>
</body>
</html>
垂直往復(fù)運(yùn)動(dòng):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例:垂直往復(fù)運(yùn)動(dòng)</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
#IECN {position:absolute;}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" />
<script type="text/javascript">
<!--
function chgPos(sId,n){
var o = document.getElementById(sId);
o.style.top = (parseInt(o.style.top)+n)+"px";
}
function chgPosStop(sId,nMax){
var o = document.getElementById(sId);
if(parseInt(o.style.top)<0){isReBack = false;}
if(parseInt(o.style.top)>nMax){isReBack = true;}
if(isReBack) {
nNum=-Math.abs(nNum);
} else {
nNum=Math.abs(nNum);
}
//return parseInt(o.style.top)>nMax || (parseInt(o.style.top)>nMax-200);
}
var nNum=10;
var isReBack = false;
lLoopRun("chgPos(IECN,nNum);","chgPosStop(IECN,300)",20);
-->
</script>
</body>
</html>
漸變顯示(圖片):
<html>
<head>
<title>lLoopRun.js 應(yīng)用實(shí)例: 漸變顯示效果</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="CnLei,楓巖" />
<style type="text/css">
body{background:#080;color:#fff;}
#IECN {
background:#fff;
filter: Alpha(opacity=10);
-moz-opacity:.10;
opacity:.10;
}
</style>
<script type="text/javascript" src="lLoopRun.js"></script>
</head>
<body>
<p>執(zhí)行次數(shù):<strong id="TestCount">0</strong></p>
<img id="IECN" src="http://bbs.iecn.net/attach-iecn/upload/7574.gif" style="left:0px;top:0px;" width="120" /><br /><br />刷新再次查看演示效果
<script type="text/javascript">
<!--
function chgOpacity(sId,n){
var o = document.getElementById(sId);
if (o.filters) {
o.filters[0].Opacity = parseInt(o.filters[0].Opacity) + n;
} else {
o.style.opacity= eval(document.defaultView.getComputedStyle(o,null).getPropertyValue(opacity)) + (n*100/10000);
}
}
function chgOpacityStop(sId){
var o = document.getElementById(sId);
if (o.filters) {
return parseInt(o.filters[0].Opacity)>=99;
} else {
return eval(o.style.opacity)>=0.99;
}
}
lLoopRun("chgOpacity(IECN,1);","chgOpacityStop(IECN)",20);
-->
</script>
</body>
</html>
原文:http://fengyan.iecn.cn/blog-html-do-showone-uid-35653-type-blog-itemid-2320.html
您可能感興趣的文章:
- Javascript OOP之面向?qū)ο?/a>
- JavaScript OOP面向?qū)ο蠼榻B
- Nodejs全棧框架StrongLoop推薦
- JavaScript運(yùn)行機(jī)制之事件循環(huán)(Event Loop)詳解
- javascript oop開發(fā)滑動(dòng)(slide)菜單控件
- Node.js事件循環(huán)(Event Loop)和線程池詳解
- JS OOP包機(jī)制,類創(chuàng)建的方法定義
- javascript 原型模式實(shí)現(xiàn)OOP的再研究
- 延時(shí)重復(fù)執(zhí)行函數(shù) lLoopRun.js
- JavaScript OOP類與繼承
- 玩轉(zhuǎn)JavaScript OOP - 類的實(shí)現(xiàn)詳解
- javascript基于prototype實(shí)現(xiàn)類似OOP繼承的方法
- Javascript oop設(shè)計(jì)模式 面向?qū)ο缶幊毯唵螌?shí)例介紹
相關(guān)文章
ElementUI在實(shí)際項(xiàng)目使用步驟詳解
這篇文章主要介紹了ElementUI在實(shí)際項(xiàng)目使用的功能總結(jié),本文分步驟通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2021-07-07淺析在javascript中創(chuàng)建對象的各種模式
下面小編就為大家?guī)硪黄獪\析在javascript中創(chuàng)建對象的各種模式。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05js定時(shí)器實(shí)現(xiàn)倒計(jì)時(shí)效果
這篇文章主要為大家詳細(xì)介紹了js定時(shí)器實(shí)現(xiàn)倒計(jì)時(shí)效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-11-11JS加密插件CryptoJS實(shí)現(xiàn)的DES加密示例
這篇文章主要介紹了JS加密插件CryptoJS實(shí)現(xiàn)的DES加密,結(jié)合實(shí)例形式分析了javascript使用CryptoJS插件進(jìn)行des加密的各種常見模式使用技巧,需要的朋友可以參考下2018-08-08javascript 系統(tǒng)文件夾文件操作及參數(shù)介紹
javascript文件操作包括寫入文件、當(dāng)前目錄文件、讀文件、刪除文件、批量刪除,未刪除文件夾,刪除不了當(dāng)前目錄文件等等,感興趣的朋友可以參考下2013-01-01解決前端接收 type:"application/octet-stream" 格
前端接收 type: “application/octet-stream“ 格式的數(shù)據(jù)并下載,還有后端既返回octet-stream還返回JSON數(shù)據(jù)時(shí)的處理方法,今天給大家分享前端接收 type:"application/octet-stream" 格式的數(shù)據(jù)并下載(解決后端返回不唯一問題)的解決方案,感興趣的朋友一起看看吧2023-12-12詳解利用exif.js解決ios手機(jī)上傳豎拍照片旋轉(zhuǎn)90度問題
這篇文章主要介紹了詳解利用exif.js解決ios手機(jī)上傳豎拍照片旋轉(zhuǎn)90度問題,有需要的朋友可以了解一下。2016-11-11JavaScript自定義超時(shí)API代碼實(shí)例
這篇文章主要介紹了JavaScript自定義超時(shí)API代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04