文字的滚动
<body>
<textarea id="textarea"></textarea>
<script>
str=" 文 字 的 滚 动 效 果";
function roll(){
str=str.substr(1,str.length)+str.substring(0,1);
document.getElementById("textarea").style.fontSize="20px";
document.getElementById("textarea").innerText=str;
}
setInterval(roll,200);
</script>
</body>
文字的打印
<body>
<textarea id="textarea"></textarea>
<script>
var str="文字的打印效果";
var index=0;
function type() {
if(index == str.length+1) {
index = 0;
}
document.getElementById("textarea").style.fontSize="15px";
document.getElementById("textarea").innerText = str.substring(0, index++);
}
setInterval(type, 500);
</script>
</body>
文字的颜色闪烁
<body>
<span id="s1">文</span>
<span id="s2">字</span>
<span id="s3">的</span>
<span id="s4">颜</span>
<span id="s5">色</span>
<span id="s6">闪</span>
<span id="s7">烁</span>
<script>
str="文字的颜色闪烁";
function color(){
r=Math.floor(Math.random()*256);
g=Math.floor(Math.random()*256);
b=Math.floor(Math.random()*256);
return "rgb("+r+","+g+","+b+")"
}
function word(){
document.getElementById("s1").style.color=color();
document.getElementById("s2").style.color=color();
document.getElementById("s3").style.color=color();
document.getElementById("s4").style.color=color();
document.getElementById("s5").style.color=color();
document.getElementById("s6").style.color=color();
document.getElementById("s7").style.color=color();
}
setInterval(word,500);
</script>
</body>
时间： 2024-08-03 23:46:03