特效描述：jQuery 文字彈幕特效。jQuery文字彈幕特效

代碼結構

1. 引入JS

2. HTML代碼

彈幕(點我呀！！)

X

讓我來一個彈幕嘿嘿贊你哈哈51前端

$(function(){

init_screen();

//alert("您好");

$("#btn,.d_del").click(function(){

$(".dm,.d_del").toggle(1000);

});

$(".s_sub").click(function(){

var text=$(".s_txt").val();

var div="

"+text+"";

$(".d_show").append(div);

init_screen();

})

});

//初始化彈幕

function init_screen(){

var _top=0;

$(".d_show").find("div").show().each(function(){

var _left=$(window).width()-$(this).width();

var _height=$(window).height();

_top=_top+76;

if(_top>=_height-100){

_top=0;

}

$(this).css({left:_left,top:_top,color:getReandomColor()});

var time=10000;

if($(this).index()%2==0){

time=15000;

}

$(this).animate({left:"-"+_left+"px"},time,function(){

});

});

}

//隨機獲取顏色值

function getReandomColor(){

return '#'+(function(h){

return new Array(7-h.length).join("0")+h

})((Math.random()*0x1000000<<0).toString(16))

}

總結

以上是生活随笔為你收集整理的html炫酷弹幕特效,jQuery文字弹幕特效的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。