Copy link to clipboard
Copied
Good evening,
1) I have a lot of different responsive video that I need to select and perform im my web page.
It could be the right solution to have a drop down menu from which to choose them and start they in the same player.
This is to try not to have a web page with an exorbitant number of players.
At my level the script is like this:
<div class="embed-responsive embed-responsive-16by9">
<iframe class="embed-responsive-item" src="MyVideo.mp4"></iframe>
</div>
Is there a vay to do what i need?
2) the player has a download option. Is there a way to disable this option?
3) the responsive player has a black background. Is there a way to disable this background?
Many thanks!
You seem to be implying you would be happy with a <select> list on your page where a video could be chosen from a list?
If so you could easily implement that by adding a select list to your page (the select code below assumes the videos are stored in your websites folder in a folder named 'videos'.
<label for="videoList">Choose a video:</label>
<select name="videosList" class="videoList" id="videoList">
<option value="videos/boat.mp4">Boats</option>
<option value="videos/roses.mp4">Roses</option>
<o
Copy link to clipboard
Copied
Where are your videos hosted?
I ask because you DO NOT need an <iframe> unless you're pulling videos from a 3rd party sharing site like YouTube or Vimeo.
Copy link to clipboard
Copied
Thank you Nancy,
this is by default in the insert bootstrap component.
May I could arrange the script without it if it could be better.
Copy link to clipboard
Copied
You didn't answer my question. Where are your videos hosted?
If they're on YouTube, use the YouTube Player API
https://developers.google.com/youtube/player_parameters
If they're on Vimeo, consult Vimeo's documentation.
https://developer.vimeo.com/api/guides/start
https://developer.vimeo.com/player/sdk
If you're self-hosting videos on your own server, get a player that supports a playlist:
Copy link to clipboard
Copied
Sorry Nancy It is hosted in my web space, not YouTube or Vimeo.
Copy link to clipboard
Copied
You seem to be implying you would be happy with a <select> list on your page where a video could be chosen from a list?
If so you could easily implement that by adding a select list to your page (the select code below assumes the videos are stored in your websites folder in a folder named 'videos'.
<label for="videoList">Choose a video:</label>
<select name="videosList" class="videoList" id="videoList">
<option value="videos/boat.mp4">Boats</option>
<option value="videos/roses.mp4">Roses</option>
<option value="videos/cat.mp4">Cat</option>
<option value="videos/storm.mp4">Storm</option>
</select>
Then add the javascript below at the very bottom of your page, directly before the closing </body> tag:
<script>
const videoList = document.querySelector('.videoList');
const embedded = document.querySelector('.embed-responsive-item');
videoList.onchange = function() {
const selected = videoList.value;
embedded.src=selected;
}
</script>
This will have the effect of swaping the src in the iframe ALTHOUGH you dont need the iframe, you could just use the 'video' tag (see below). Both options, iframe is commented out.
<div class="embed-responsive embed-responsive-16by9">
<video class="embed-responsive-item" src="videos/boat.mp4" controls autoplay type="video/mp4"></video>
<!-- <iframe class="embed-responsive-item" src="videos/boat.mp4"></iframe> -->
</div>
Copy link to clipboard
Copied
Thank you both but particularly to Osgood, this was what I exactly need!!
A secondary detail: I can add "controls controlsList="nodownload" to avoid the download of my video files, but this not work with the right mouse click.
I there a way to avoid the right mouse click or to avoid the "save video as" after the right mosue click?
Thank you very much again!!!
Copy link to clipboard
Copied
If you're concerned about people taking your content, don't post it online. Owing to how the Internet works, you can't prevent people from accessing your media files. When people click the play button, the file is automatically downloaded to their device's browser cache. It's there for anyone who wants it. In addition, people can find the video in your source code and grab it that way. So disabling right-click is NO SOLUTION. It doesn't protect anything.
Copy link to clipboard
Copied
Thank you again Nancy, I imagined it it but i preferred to ask.