网站版建设,广州企业网站建设方案,wordpress挖,嘉兴网站建设推荐浙江华企jquery.barrager.js是一款专业的网页弹幕插件。它支持显示图片,文字以及超链接。支持自定义弹幕的速度、高度、颜色、数量等。能轻松集成到论坛,博客等网站中。由于IE9以下的IE浏览器不兼容CSS圆角,采用兼容样式,可单独设置弹幕的颜色,属性为old_ie_color,建议不要与网页主背景…jquery.barrager.js是一款专业的网页弹幕插件。它支持显示图片,文字以及超链接。支持自定义弹幕的速度、高度、颜色、数量等。能轻松集成到论坛,博客等网站中。由于IE9以下的IE浏览器不兼容CSS圆角,采用兼容样式,可单独设置弹幕的颜色,属性为old_ie_color,建议不要与网页主背景色相同。使用方法使用jquery.barrager.js弹幕插件需要在页面中引入jquery和jquery.parallux.min.js文件。发布弹幕弹幕文字为必选项,图片,链接如果为空则不显示。其它的可选项有默认值,弹幕具体配置如下代码。var item{img:static/heisenberg.png, //图片info:弹幕文字信息, //文字href:http://www.yaseng.org, //链接close:true, //显示关闭按钮speed:6, //延迟,单位秒,默认6bottom:70, //距离底部高度,单位px,默认随机color:#fff, //颜色,默认白色old_ie_color:#000000, //ie低版兼容色,不能与网页背景相同,默认黑色}$(body).barrager(item);清除所有弹幕可以通过removeAll()方法来清除所有的弹幕。$.fn.barrager.removeAll();集成通用后端代码读取服务端有两种模式,适应于各种不同的场景1、实时读取,隔x秒请求一次接口,获取一条弹幕,发送。2、一次读取完毕,隔x秒发送一条弹幕。注意:json数据需要HTML 实体化以防止xss攻击。第一种模式示范代码 server 端(php代码)//数组里面可以自定义弹幕的所有属性。$barragesarray(array(info 第一条弹幕,img static/img/heisenberg.png,href http://www.yaseng.org,),array(info 第二条弹幕,img static/img/yaseng.png,href http://www.yaseng.org,color #ff6600),array(info 第三条弹幕,img static/img/mj.gif,href http://www.yaseng.org,bottom 70 ,),array(info 第四条弹幕,href http://www.yaseng.org,close false,),);//随机输出一个echo json_encode($barrages[array_rand($barrages)]);浏览器端获取json弹幕数据,通过setInterval()来调用,如有弹幕,就显示。 代码如下//每条弹幕发送间隔var looper_time3*1000;//是否首次执行var run_oncetrue;do_barrager();function do_barrager(){if(run_once){//如果是首次执行,则设置一个定时器,并且把首次执行置为falseloopersetInterval(do_barrager,looper_time);run_oncefalse;}//获取$.getJSON(server.php?mode1,function(data){//是否有数据if(data.info){$(body).barrager(data);}});}第二种模式示范代码。 server 端 (php代码)$barragesarray(array(info 第一条弹幕,img static/img/heisenberg.png,href http://www.yaseng.org,),array(info 第二条弹幕,img static/img/yaseng.png,href http://www.yaseng.org,color #ff6600),array(info 第三条弹幕,img static/img/mj.gif,href http://www.yaseng.org,bottom 70 ,),array(info 第四条弹幕,href http://www.yaseng.org,close false,),);echo json_encode($barrages);浏览器端代码$.ajaxSettings.async false;$.getJSON(server.php?mode2,function(data){//每条弹幕发送间隔var looper_time3*1000;var itemsdata;//弹幕总数var totaldata.length;//是否首次执行var run_oncetrue;//弹幕索引var index0;//先执行一次barrager();function barrager(){if(run_once){//如果是首次执行,则设置一个定时器,并且把首次执行置为falseloopersetInterval(barrager,looper_time);run_oncefalse;}//发布一个弹幕$(body).barrager(items[index]);//索引自增index;//所有弹幕发布完毕清除计时器。if(index total){clearInterval(looper);return false;}}});
