bytedance / xgplayer

A HTML5 video player with a parser that saves traffic
https://h5player.bytedance.com/
MIT License
8.17k stars 858 forks source link

弹幕插件不能单独对某一个弹幕设置字体大小fontSize,无效 #1360

Closed startjava closed 1 month ago

startjava commented 5 months ago
                style: {                 //弹幕自定义样式
                    color: "#ff9500",         //例:'#ff9500',
                    fontSize: "100px",
                    padding: "20px 11px"        //例: 2px 11px',
                },

最新版本的danmu插件

import {createApp, onMounted} from 'vue'
import Player from 'xgplayer';
import 'xgplayer/dist/index.min.css';
import Danmu from 'xgplayer/es/plugins/danmu'
import 'xgplayer/es/plugins/danmu/index.css'

createApp({
    setup() {

        onMounted(() => {

            const comments = [{
                duration: 20000,         //弹幕持续显示时间,毫秒(最低为5000毫秒)
                id: 1,               //弹幕id,需唯一
                start: 1000,           //弹幕出现时间, 单位:ms 毫秒
                prior: false,          //该条弹幕优先显示,默认false
                color: true,          //该条弹幕为彩色弹幕,默认false
                txt: "我是弹幕1",
                style: {                 //弹幕自定义样式
                    color: "#ff9500",         //例:'#ff9500',
                    fontSize: "100px",
                    padding: "20px 11px"        //例: 2px 11px',
                },
                mode: "scroll"           // 例:'top', 显示模式,top顶部居中,bottom底部居中,scroll滚动,默认为scroll
            },
                {
                    duration: 20000,         //弹幕持续显示时间,毫秒(最低为5000毫秒)
                    id: 2,               //弹幕id,需唯一
                    start: 2000,           //弹幕出现时间, 单位:ms 毫秒
                    prior: false,          //该条弹幕优先显示,默认false
                    color: true,          //该条弹幕为彩色弹幕,默认false
                    txt: "我是弹幕2",
                    style: {                 //弹幕自定义样式
                        color: "blue",         //例:'#ff9500',
                        fontSize: "100px",
                        padding: "20px 11px"        //例: 2px 11px',
                    },
                    mode: "scroll"           // 例:'top', 显示模式,top顶部居中,bottom底部居中,scroll滚动,默认为scroll
                }, ,
                {
                    duration: 20000,         //弹幕持续显示时间,毫秒(最低为5000毫秒)
                    id: 3,               //弹幕id,需唯一
                    start: 2000,           //弹幕出现时间, 单位:ms 毫秒
                    prior: false,          //该条弹幕优先显示,默认false
                    color: false,          //该条弹幕为彩色弹幕,默认false
                    txt: "我是弹幕3",
                    mode: "scroll"           // 例:'top', 显示模式,top顶部居中,bottom底部居中,scroll滚动,默认为scroll
                }];

            let player = new Player({
                id: 'xgplayerDiv',
                url: '../xgplayer-demo-720p.mp4',
                height: '100%',
                width: '100%',
                plugins: [Danmu],
                danmu: {
                    comments: comments
                }
            });
        });
    }
}).mount("#mydiv1");

这是我的测试代码

startjava commented 5 months ago

@shanyutongxue 大佬,加油啊

startjava commented 5 months ago

@hongqx

github-actions[bot] commented 2 months ago

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in 30 days.

github-actions[bot] commented 1 month ago

This issue has been automatically closed after a period of inactivity. If it is still present in the latest release, please create a new issue with up-to-date information. Thank you!