用jquery写的一个弹幕,供大家参考,具体内容如下
效果图:

源码:
<html> <head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--
<link href="favicon.ico" rel="shortcut icon" type="image/x-icon" />
<link href="favicon.ico" rel="Bookmark" type="image/x-icon" />
-->
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>JQuery弹幕</title>
<link href="" rel="stylesheet" />
</script>
<style type="text/css">
body {
overflow: hidden;
}
.content {
overflow: hidden;
}
.ctxt {
background: burlywood;
width: 100%;
overflow: hidden;
margin: 0 auto;
z-index: 9999;
}
.ctxt p {
left: 95%;
margin: 0;
padding: 0;
z-index: 99;
overflow: hidden;
}
#msg{
height: 24px;
width: 200px;
}
#barrage {
color: gainsboro;
border: 1px solid aqua;
font-size: 12px;
border-radius: 10px;
float: right;
}
#style {
margin-top: 10px;
}
#publish {
display: none;
}
video {
width: 100%;
overflow: hidden;
z-index: -99999;
}
#danmu {
position: absolute;
overflow: hidden;
font-size:20px;
}
</style>
</head>
<body>
<div class="content">
<div id="" class="ctxt">
<video id="vodio" autoplay="autoplay">
<source src="video/1429411761ed3dc100c73251.mp4" type="video/mp4">
</source>
</video>
</div>
<div id="style">
<button id="barrage"> <font style="color: white;">开始弹幕</font></button>
<div id="publish">
<form method="post" align="center">
<input type="text" id="msg" />
<button type="button" id="submitBut">发布</button>
</form>
</div>
</div>
</div>
<script type="text/javascript" src="js/jquery-2.1.1.min.js" ></script>
<script type="text/javascript">
$(document).ready(function() {
$("#barrage").click(function() {
$("#publish").toggle();
});
$("#submitBut").click(function() {
var msgtxt = $("#msg").val();










