怎么隐藏audio播放器的播放进度条,只保留播放按钮?

怎么隐藏audio播放器的播放进度条,只保留播放按钮?

在这里插入图片描述

截图
在这里插入图片描述

在页面最右边的button中嵌套了audio音频播放器,播放器默认的样式有一个播放进度条,导致页面宽度被撑开了,布局被破坏。

第一种:



第二种:


如果去掉controls值,可以隐藏播放进度条,但是整个播放器也无法播放了。
把control更换成autoplay虽然解决了进度条的问题,但是又无法控制背景音乐的暂停功能了。

深圳分院|内门弟子] JS-黄麒二

可以隐藏默认样式,切个图,引入一个js文件,使用onclick事件点击图标触发播放或暂停

[外门弟子] JS-7

方法一

   1    添加音频控件     autoplay="autoplay

   2   设置宽高   只剩下  播放按钮

  3   定位到   你想要的地方

  4  设置成   完全透明       自己看   用  rgba  透明还是   opacity

  5   设置   自己想不说了   

方法二

  添加js
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值