javascript + jquery实现定时修改文章标题

2014-03-19 39

用javascript+jquery写的一个定时器,定时修改文章标题。

<!DOCTYPE html> 
<html> 
<head> 
<title>TODO supply a title</title> 
<meta charset="GB2312"> 
<meta name="viewport" content="width=device-width"> 
</head> <body> 
<div> 
<ul id="jokeTitle"> 
<li class="line">Test Line One</li> 
<li class="line">Test Line Two</li> 
<li class="line">Test Line Three</li> 
</ul> 
</div> 
<script type="text/javascript" src="ie/js/jquery-1.9.0.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
var changeJokeTitle = { 
line:3, //笑话的总行数 
timeSpan:1850, //时间间隔(毫秒) 
interval:'', //定时器句柄,以便于停止 
showLineFlag:0, //标志, 
change:function(){ 
var currentLine = (++changeJokeTitle.showLineFlag)%(changeJokeTitle.line); 
$('#jokeTitle li:eq('+currentLine+')').show(); 
$('#jokeTitle li:not(:eq('+currentLine+'))').hide(); 
}, 
run:function(){ 
$('#jokeTitle li:eq(0)').show(); 
$('#jokeTitle li:not(:eq(0))').hide(); 
changeJokeTitle.interval = setInterval(changeJokeTitle.change, changeJokeTitle.timeSpan); 
} 
}; 
changeJokeTitle.run(); 
}); 
</script> 
</body> 
</html>
展开阅读全文

更多Javascript文章

ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
Feb 03 47
js中的hasOwnProperty和isPrototypeOf方法使用实例
Jun 06 160
js实现上传图片预览的方法
Feb 09 42
JS采用绝对定位实现回到顶部效果完整实例
Jun 20 53
学习jQuery中的noConflict()用法
Sep 28 45
原生js实现获取form表单数据代码实例
Mar 27 29
详解如何运行vue项目
Apr 15 49
手机访问当前页面