zhw2590582 / ArtPlayer

:art: ArtPlayer.js is a modern and full featured HTML5 video player
https://artplayer.org
MIT License
2.49k stars 264 forks source link

[ UX ] 进度条下方组件位置偏移 #723

Closed Marrrrrrrrry closed 5 months ago

Marrrrrrrrry commented 5 months ago

暂停、全屏等组件并未垂直居中

另 5.1.2 中如果宽度不够,组件会移动到画布外,因为是未发布版本所以在这里提不新开 issue 了

1551362798 commented 5 months ago

请问你知道怎么隐藏下方的进度条吗?全屏后也会有

zhw2590582 commented 5 months ago

@Marrrrrrrrry 未居中是因为进度条和工具栏之间有一个gap, 你可以用css把它去掉:

--art-bottom-gap: 0px

组件会移动到画布外,这个需要你自己去做自定义的,如在什么尺寸下显示不同的工具,播放器默认是不做区分的

zhw2590582 commented 5 months ago

@1551362798 你是不是指迷你进度条?miniProgressBar: false 既可

1551362798 commented 5 months ago

@zhw2590582 抱歉我随便找的issue问的,我就是平时看动漫网站的时候,视频全屏后下方有一个不是那么明显进度条,我不知道怎么解决,我对代码也一窍不通,好像播放器也有不同种类,所以请教下你, 这个代码该怎么用啊

Marrrrrrrrry commented 5 months ago

@Marrrrrrrrry 未居中是因为进度条和工具栏之间有一个gap, 你可以用css把它去掉:

--art-bottom-gap: 0px

组件会移动到画布外,这个需要你自己去做自定义的,如在什么尺寸下显示不同的工具,播放器默认是不做区分的

哦哦,我是 UX 所以我没细看样式。你们是目前我见过最像bilibili的三方播放器了,挺喜欢这个项目的 :)

zhw2590582 commented 5 months ago

@1551362798

var art = new Artplayer({
    container: '.artplayer-app',
    url: '/assets/sample/video.mp4',
    miniProgressBar: false,
});