麻烦大神帮我看看,这个弹幕的代码
如果我在上一条弹幕还没执行完,还没clearInterval,就发送下一条弹幕,弹幕就会停止,不正常执行
麻烦帮我看下怎么解决,谢谢~
<html>
<style>
#danmuScreen{
background-color:black;
height:300px;
width:300px;
}
</style>
<body>
<div id="danmuScreen">
</div>
<input type="text" id="text"></input><button id="send" onClick="creatDanmu()">发送弹幕</button>
<script type="text/javascript">
//创建弹幕div
function creatDanmu(){
var danmuScreen=document.getElementById("danmuScreen");
var danmuDiv=document.createElement("div");
var text=document.getElementById("text").value;
var danmuText=document.createTextNode(text);
danmuDiv.appendChild(danmuText);
danmuScreen.appendChild(danmuDiv);
//设置弹幕div的CSS
var color='#'+Math.floor(Math.random()*0xffffff).toString(16);
danmuDiv.style.color=color;
var fontsize=Math.floor(30*Math.random())+'px';
danmuDiv.style.fontSize=fontsize;
danmuDiv.style.position="absolute";
danmuDiv.style.left="300px";
var top=Math.floor(300*Math.random())+30+'px';
danmuDiv.style.top=top;
//弹幕运动(改变left)
function move(){
left=parseInt(danmuDiv.style.left);
left--;
danmuDiv.style.left=left+'px';
var distance=parseInt(danmuDiv.style.left)+parseInt(danmuDiv.offsetWidth);
if(distance<=0){clearInterval(timer)
danmuScreen.removeChild(danmuDiv)}
}
timer=setInterval(move,10);
}
</script>
</body>
</html>