本文主要是介绍JavaScript实现跑马灯效果,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
一段简单的代码,实现类似公司大屏幕上“欢迎XX领导莅临指导”,在JavaScript中可以轻松实现
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body>
<span id="txt"> 恭喜杜杜的老公攒到人生第一个一百万</span>
<script type="text/javascript">function show() {//html中哦通过DOM找到文本内容var content = document.getElementById('txt');var dataString = content.innerText;//让文字动起来var firstChar = dataString[0];var otherChar = dataString.substring(1, dataString.length);var nenwString = otherChar + firstChar//在html中更新内容content.innerText = nenwString;}//定时器setInterval(show,1000);
</script>
</body>
</html>
代码如上
在JavaScript中要写一个函数,函数做的事情就是把第一个字符不断地放到文本的末尾,通过定时器循环调用这个函数即可实现效果,前端代码玩一下很有意思。
这篇关于JavaScript实现跑马灯效果的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!