html网页弹幕特效,jquery仿哔哩哔哩弹幕文字动画特效

特效描述：弹幕文字动画 动画特效，jquery仿B站弹幕，可自由设置字体颜色

代码结构

1. 引入CSS

2. 引入JS

3. HTML代码

发送

(function(){

var t=false;

$("#color_choice").bigColorpicker(function(el,color){

$(el).css("background-color",color);

t=true;

});

$("#send_out").click(function(){

var cl;

if(t){

cl=$("#color_choice").css("background-color");

}else{

cl="#FFFFFF";

}

var text=$("#input_value").val();

if(text != ''){

var number=parseInt(Math.ceil(Math.random()*50)+10)

var div1=document.getElementById("input_text");

div1.innerHTML=""+text+"";

$("#input_value").val("");

$("#send_out").attr("disabled", true);

var time1=setTimeout("$('#send_out').text('6s')",0);

var time2=setTimeout("$('#send_out').text('5s')",1000);

var time3=setTimeout("$('#send_out').text('4s')",2000);

var time4=setTimeout("$('#send_out').text('3s')",3000);

var time5=setTimeout("$('#send_out').text('2s')",4000);

var time5=setTimeout("$('#send_out').text('1s')",5000);

var time6=setTimeout("$('#send_out').attr('disabled', false);$('#send_out').text('发送')",6000);

alert(di1.innerHTML);

}else{}

});

})();