I have a page built with webflow, it has a webflow video background put in it. It seems to come muted by default which is fine.
I would just like to include a small button in the corner so the user is able to unmute and mute the audio at the very least. If we can add volume that is even better.
<!-- MUTEBUTTON \/ MUTEBUTTON -->
<script>
var themutebtn;
intitializePlayer() // **don't forget to call the initialize**
function intitializePlayer(){
//set object references
vid = document.getElementById("intro_video");
themutebtn = document.getElementById("audioswitch1");
//add event listener
themutebtn.addEventListener("click",vidmute,false); // **quotes only around the event**
}
function mute_switch(){ // **there was an extra '.' between function and vidmute**
if(vid.muted){
vid.muted = false;
themutebtn.innerHTML = "mute";
} else {
vid.muted = true;
themutebtn.innerHTML = "Unmute";
}
}
</script>
<!-- MUTEBUTTON /\ MUTEBUTTON -->
Okay, so now that you have informed me I have sought out a method to build a custom video background and a mute and unmute button to go with it.
I have found a post that seemed to provide a straightforward approach that I am now navigating my way through, I took the HTML code and put it into a custom embed, added the javascript, and gave the mute id to my previously built button. Then I matched the CSS settings best I could through webflow to the associated classes.
There are a few things, I can not get the test video to go full screen (btw I am seeking out a free trial for hosting the video or something inexpensive, until I can figure out how to deal with Amazon). The other thing is that I can not get the mute button to work although the sound is playing.
So that’s two out of three that needs too be fixed but a little bit of something is better than a little bit of nothing.
I am currently seeking advise, help, and possibly hired assistance through meet ups and previous mentors, along with the online forums of coarse.
Whatever I end up comming up with I will be sure to post.
( I have to get this done tonight or tomorrow night the album is due to launch thursday.)
Okay so I still haven’t slept yet, I have Japanese class in like 4 hours. yon. I have managed to upload the video to an amazon bucket i made the other night. It gives me a link, i put it in the code I have…
IT WORKS, with the audio, … but only in the designer… on preview while i am working on it. This makes me feel a little better because something is working.
however I am completely stumped at this time. I don’t know why it is not working in the browser after publish… I would like this to be one of those things I wake up the next day and for some reason can fix in five minutes, but I don’t think that is the case.
I may want to start from scratch… I don’t know…
THANK YOU SO MUCH BART!! Hrm I wander why it’s not working on mine… the only thing I can think of is that maybe the file is big and is taking my internet a long time to load. I guess at some point adding a loading animation would be nice. Maybe try to get the file size down a bit, which should probably be optimized anyways.
I am wandering what is a good number of mega-bites maybe 90 max? I guess all I can do right now is test with a smaller video. Becoming more knowledgeable on the list of things to do as well.
I got it down to 5mb still having issues. I am a bit stumped because it was working momentarily with larger version but then it stopped after a refresh (im pretty sure) and no changes… no errors in the console.
Opening your site shows a video that has audio on. Pressing