yaseng / jquery.barrager.js Goto Github PK
View Code? Open in Web Editor NEW专业的网页弹幕插件
Home Page: http://yaseng.github.io/jquery.barrager.js
专业的网页弹幕插件
Home Page: http://yaseng.github.io/jquery.barrager.js
希望解决一下这个bug
自定义了一个div,然后设置了一下属性,将 $('body').barrager(item);的body更改为div,好像并不能实现
感觉只能在body上实现弹幕,位置就只能设置好随机数了。
那么如何才能在一个特定的div里面实现弹幕呢
点击官网首页的”弹弹弹“按钮产生弹幕,点击次数少没影响,快速不断点击产生的弹幕会导致弹幕移动速度极慢。刚才测试了一下,已经过去好多分钟了,所有弹幕1/10的屏幕都没走完。
取消点击文字跳转
$.fn.barrager.removeAll(); 好像只能清除屏幕上有的,而不能清除队列上所有的
我现在的问题是这样的.打开一个图片后,然后加载这个图片的所有弹幕
但是当切换照片的时候,我希望之前一个队列里面的所有弹幕全部中止
当存在大量弹幕(20条以上) 会明显出现 弹幕的移动速度会整体放慢,如本来设定的setInterval 步长为6 但是当多次点击“弹弹弹”或者采用服务器端读取弹幕信息来输出的时候,弹幕的移动速度明显的下降了。暂时我也找不出原因,猜测是多条弹幕运行 导致浏览器性能下降,弹幕之间发送是采用同步进行的,如果是异步进行可能就没问题了。
和官网同样是6速度, 但是速度明显比官网快很多, 而且不是很流畅
而且换到别的网页的时候, 弹幕也不会停, 而官网的会停.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>会议弹幕</title>
<link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css" media="screen" />
<link rel="stylesheet" type="text/css" href="static/css/style.css" />
<link rel="stylesheet" type="text/css" href="dist/css/barrager.css">
<link rel="stylesheet" type="text/css" href="barrage.css">
<link rel="stylesheet" type="text/css" href="static/pick-a-color/css/pick-a-color-1.2.3.min.css">
<link rel="stylesheet" type="text/css" href="static/syntaxhighlighter/styles/shCoreDefault.css"/>
</head>
<body class="bb-js" onload="onload()" id="body">
<button type="button" onclick="send()">send</button>
<script type="text/javascript" src="./barrage.js"></script>
<script type="text/javascript" src="./tool.js"></script>
<script type="text/javascript" src="static/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="static/js/bootstrap.min.js"></script>
<script type="text/javascript" src="static/js/tinycolor-0.9.15.min.js"></script>
<script type="text/javascript" src="dist/js/jquery.barrager.js"></script>
<script type="text/javascript" src="static/syntaxhighlighter/scripts/shCore.js"></script>
<script type="text/javascript" src="static/syntaxhighlighter/scripts/shBrushJScript.js"></script>
<script type="text/javascript" src="static/syntaxhighlighter/scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="static/pick-a-color/js/pick-a-color-1.2.3.min.js"></script>
</body>
</html>
同一时间发出多个弹幕,弹幕会随机相互覆盖,可能随机算法需要添加一些规则,如果同时有其他弹幕在某个网页某个高度,新弹幕就应该在空闲的高度出现
作者你好,这个有hexo插件嘛?我没有找到。有的话,能给下插件名字或者地址嘛?谢谢!
当网页上超过一定数量弹幕,感觉弹幕就跑不动了
数据很少的时候一会儿就飘完了,想让它加载完所有弹幕后再重新加载怎么弄。
普通的QQ表情包
怎么控制弹幕的范围,把$('body').barrager(item)的body替换成指定div没作用
用户是否可以自定义弹幕背景色非字体颜色
楼主的这个弹幕不论是效果上还是操作上都是很方便的。但是希望可以支持指定容器,即弹幕不会跳出那个容器。虽然现在配合jq进行计算后可以通过bottom参数来控制,但是感觉还可以更方便点。
另外,也希望能有一个无依赖版本的,因为在手机端再放入一个jq,感觉怪怪了。如果无依赖,那用到vue等地方就更方便了。
能反方向弹幕不?从左往右
看文档说最新的是1.1版本,单看文件后缀还是1.0的
是否可以布置在项目中,此源码遵循什么协议?
可以搞个demo 基于WebSocket协议的
弹幕在px单位下正常。但是如果在移动端rem单位下,就不正常了。
压缩后的jquery.barrager.min.js中,$.fn.barrager.removeAll=function(){$('.barrage').remove()}}报错,$前面应加上分号
$(id).animate({
right: this_width
}, barrage.speed * 1000, function() {
$(id).remove();
});
jquery.barrager.min.js源码里这段注释后就可以使用
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.