PHP程序员小白到大牛集训(12期免息)
博主信息
梁凯达的博客
博文
250
粉丝
3
评论
0
访问量
199948
积分:0
P豆:567

JS-文字跑马灯特效

2019年03月04日 11:34:09阅读数:2736博客 / 梁凯达的博客/ html

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<font id="show" color="blue" size="6"></font>
</body>
<script>
var show = document.getElementById('show');
var str = '今天也是3月1号也就是说一九年已经过去两个月了';
//将字符串添加标签的函数
function pick(i,str){
	tmp = str.substr(0,i);
	tmp +='<font color="red" size="7">'+str[i]+'</font>';
	tmp += str.substr(i+1);
	//alert(tmp);
	return tmp;
}
	var num = 0;
	setInterval(function(){
		if(num >=str.length){
			num = 0;
		}
		show.innerHTML =pick(num,str);
		num++;
	},300)
</script>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

版权申明:本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!

全部评论

文明上网理性发言,请遵守新闻评论服务协议

条评论