取消静音背景视频的按钮

索昆

尝试使用自带的视频背景英雄(在带elemnetor的wordpress中使用),该英雄在加载时自动播放但没有声音,因为应使其符合ADA规范并受到某些Web浏览器的支持,然后将其静音。

我想知道是否可以有一个按钮/图标来取消声音的静音,但同时又重新启动视频,以便30秒的信息和声音从头开始?

问题:
我将其设置为无声音自动播放,并使用此技术和此代码(https://elementorcodes.com/elementor-video-background-sound-button/添加了一个图标,但是如何触发重新启动同时?

码:

document.addEventListener('DOMContentLoaded', function() {
var toggleSoundButton = document.querySelector('.fa-volume-mute');
var heroBackgroundVideo = document.querySelector('.herosection video');
toggleSoundButton.addEventListener('click', function (event) {

if (heroBackgroundVideo.muted !== false){
heroBackgroundVideo.muted=false;
toggleSoundButton.classList.add('fa-volume-up');
} else {
heroBackgroundVideo.muted=true;
toggleSoundButton.classList.remove('fa-volume-up');
} }); });
</script>
伦德斯特罗夫斯基
heroBackgroundVideo.currentTime = 0;
heroBackgroundVideo.play();

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

想要为全屏视频背景上的音频创建自定义静音/取消静音按钮

需要视频在按键时静音/取消静音(无按钮)

如何在WebRTC视频聊天中添加音频/视频静音/取消静音按钮

使用jQuery视频静音/取消静音

Vimeo视频,带有使用视频标签的自定义取消静音按钮

WebRTC 视频流静音/取消静音在取消静音后不流式传输

如何在twilio视频通话中静音/取消静音暂停/取消暂停音频和视频

如何快速制作静音和取消静音按钮?

使YouTube视频静音以显示网站背景

Divi Builder背景视频将被静音

Javascript-如何在iframe中取消对YouTube视频的静音

Twilio Video 在 Node.js 中静音和取消静音音频和视频

反转静音/取消静音功能,此特定的html5视频播放器

逐步切换静音/取消静音视频的音频

如何在 Corvid 中使文本静音/取消静音视频?

将背景音乐静音/取消静音切换?更换图片?

Xubuntu 12.04联想T500硬件静音按钮不会取消静音

Azure Media Player的自定义静音和取消静音按钮

视频取消静音时无法通过 iframe API 播放 YouTube 视频

静音和取消静音功能

使用 AVPlayer 时,如何检测用户何时快速取消视频静音

如何取消27个YouTube视频的静音(并关闭自动播放)?

HTML和JavaScript-无法取消html5视频的静音

取消静音视频 JS 脚本在控制台中工作但不是页面

如何在自动播放时取消静音 wordpress fvplayer 视频

如何制作适当的静音命令,该命令在取消静音时静音,在静音时取消静音

静音和取消静音Swift Spritekit

如何识别静音/取消静音点击-解决

从PC静音/取消静音android设备