Connect_logo_6.png 退出
前端视频教程 小程序 众筹源码 python 商城源码 商城模板 响应式模板 中文模板 手机模板 企业源码
充值

jQuery+Dplayer.js仿哔哩哔哩视频文字弹幕代码

作者/代码整理:  (转载请附加本文地址,带?#23567;?#25042;人原生”字样的谢绝转载) 发布日期:2018-01-22
一款非常好看的jQuery+Dplayer.js仿哔哩哔哩视频文字弹幕代码,jQuery网站视频弹幕特效。


js代码

<script src="js/DPlayer.min.js"></script>
<script>
    console.log(" %c 该项目基于Dplayer.js",'color:red')
    var dp = new DPlayer({
        element: document.getElementById('player1'),
        video: {
            url: 'http://oz4nlgp7a.bkt.clouddn.com/ss.mp4',
            pic: 'css/danmu.jpg'
        },
        danmaku: {
            id: 'demo',
            api: 'https://api.prprpr.me/dplayer/',
            addition: ['https://api.prprpr.me/dplayer/bilibili?aid=15572523']
        }
    });
    // 弹出框
    function alert_back(text) {
        $(".alert_back").html(text).show();
        setTimeout(function () {
            $(".alert_back").fadeOut();
        },1200)
    }
    //秒转分秒
    function formatTime(seconds) {
        return [
//            parseInt(seconds / 60 / 60),
            parseInt(seconds / 60 % 60),
            parseInt(seconds % 60)
        ]
            .join(":")
            .replace(/\b(\d)\b/g, "0$1");
    }
$.ajax({
    url:"https://api.prprpr.me/dplayer/bilibili?aid=15572523",
    success:function (data) {
        if(data.code=="1"){
            var danmaku=data.danmaku;
            var autor="农民";
            $(".danmuku_num").text(danmaku.length)
            $(danmaku).each(function (index,item) {
                if(item.type=="right"){
                }else
                {
                    autor="地主"
                }
                var oLi=`   <ol class="danmuku_list" time="${item.time}">
            <li>${formatTime(item.time)}</li>
            <li title="${item.text}">${item.text}</li>
            <li>${autor}</li>
</ol>
`
                $(".list_ovefiow").append(oLi);
                autor="农民";
            })
        }else {
            alert_back("弹幕加载失败 -v-!");
        }
        $(".danmuku_list").on("click",function () {

            dp.seek( $(this).attr("time"))
        })
    }
})
</script>

猜你喜欢...
74cms5.0含所有商业插件+WeChat mini_v1.0.14骑士5.0小程序前端和5.0配置教程
Thinkphp多VIP等级推广聊投?#39318;?#25910;益金融?#25945;?#22806;包客户开发运营版
跑分自助补单客户二开?#25042;?#29256;
Thinkphp5在线智能还款APP 在线申请APP 样卡神奇 高效率还款 智能账单管理 实时提醒永不逾期
米哆全民软文推广1.8.5微擎微信公众号文章营销推广系统源码
全功能运营版龙兵社区拼团社区团购8.0.73小程序 电商型社区团购系统源码
laravel客客威客3.6众包任务?#25945;?#27491;版带开发和后台使用手册
江小白服饰贴图定制1.0.26微擎小程序源码 订购商城DIY贴图系统源码
Thinkphp仿抖音快手朋友圈点赞 自动?#19968;?#20570;任务赚钱?#25945;?#28304;码
黄色UI新版区块链挖矿二开运营版
有钱还超火爆众筹系统微擎运营版送白皮书
135k代驾搭车1.2.20微擎微信小程序源码 同城代驾系统源码
免签直达商户支付自动充值系统共六个模块带详?#20184;?#25509;文档
Thinkphp5有钱还智能还款还贷系统包搭建
千行云论坛5.2.2带课堂答题考试和积分商城多个插件
深海?#23383;?#20184;8.3.0全解密并去除授权带在线开发文档
大橙子3.16模板白色干净的响应式电影整站源码
数字资产区块链期权交易?#25945;?#28304;码时间盘点位盘外汇交易?#25945;?#28304;码
多商户商业版商城网站源码 四合一集?#20064;?送安装教程
诺诺9.1二开视频打赏赚钱?#25945;?#28304;码 对接支付跳转 火车?#20961;?#38598;半自动采集
极速快三全天人工计划
体彩超级大乐透走势图坐标标准版 福建体彩31选7开奖走势 美元黄金走势实时 足球8人制站位图解 新濠电玩城游戏大厅 彩票开奖查询彩 吉林时时彩一天多少期 体彩福建36选7开奖 双色球基本走势图表图中彩网 平码复式3中2组数算法 竞彩篮球大小分与盘口 安徽十一选五开奖结果一定牛 江苏体彩七位数规则 极速快3玩法 真实足球2012苹果版