html:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>跑马灯</title>
<style type="text/css">
body {
background: #FFF;
}
input {
background: transparent;
border: none;
color: #ff4332;
font-size: 45px;
font-weight: bold;
font-family: "微软雅黑";
}
</style>
<script type="text/javascript" src="js/jquery-2.2.2.min.js"></script>
<script type="text/javascript">
var msg = "品味中原文化,寄情黄河风景,空谷寻香觅幽兰,驾着蜗牛追导弹";
// 移动的文字
var interval = 400;
// 移动的速度
var seq = 0;
function LenScroll() {
document.nextForm.lenText.value = msg.substring(seq, msg.length) + " " + msg;
seq++;
if (seq > msg.length)
seq = 0;
// msg.substring(seq, msg.length)这句就是 截取 msg字符变量,从0到seq+1 个位置 的字符 。
// 如果seq=0的话 截取字符就是H。seq++ 就是为了 能把msg整个这截取完。也就是为了实现走马灯效果
window.setTimeout("LenScroll();", interval);
}
</script>
</head>
<body onload="LenScroll()">
<center>
<form name="nextForm">
<input type="text" name="lenText" />
</form>
</center>
</body>
</html>
result(文字循环播放):