I use html5 to play video like this.
<video oncontextmenu="return false;" id="videoElementID" width="320" height="240" controls>
<source src="Welcome.mp4" type="video/mp4">
<track src="Welcome.vtt" kind="subtitles" srclang="en" label="English">
</video>
It can protect right click to download but it can download in source code like this.
In udemy it have no video in code like this. How to protect download video in source code to download.
You can't. Because, If somebody is watching your video — he already has it.
Related
I almost made it so I can have background music but when I go to my localhost it just downloads the music instead of playing it but in the full path one it plays it in the background so how can I prevent this from happening so it won't download in localhost?
Here is the code for it and the file name is actually "Sound.mp3" as well.
<embed src="Sound.mp3" autostart="true" loop="true"width="2" height="0" controls>
Any ideas of what do add to make it just play and not download?
I am actually working on a page that looks pretty cool and wanted to add background music cause it is actually an "under construction" page and wanted to make it look cooler with background music.
The prefered way of adding audio in Html5 is to use the audio element.You can achieve them by using the following codes,
This code will play the Sound.mp3 file with the controllers displayed for the user. So the users can control the background music. With the autoplay attribute, the music will start automatically.
<audio controls="controls" autoplay="autoplay"><source src="Sound.mp3" type="audio/mpeg" /></audio>
If you don't wanna show the controls, you can simply remove the controls attribute. As follows,
<audio autoplay="autoplay"><source src="Sound.mp3" type="audio/mpeg" /></audio>
But the song will autoplay because the autoplay attribute is added.
Unfortunately, not all browsers support mp3, so it's a good idea to include multiple versions of the file in different formats. As follows,
<audio autoplay="autoplay">
<source src="Sound.mp3" type="audio/mpeg" />
<source src="Sound.wav" type="audio/wav" />
<source src="Sound.ogg" type="audio/ogg" />
<p>This content is displayed by browsers that don't recognize the audio element.</p>
</audio>
Hope it helped. Good luck with your project. :)
More Attributes
loop - Automatically loop (keep playing over and over).
Use Tag to attach the attach the audio file to the html file.
If your audio file is Sound.mp3 then include it in <audio> tag.
<audio controls>
<source src="Sound.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
or use the below code
<audio src="Sound.mp3"> </audio>
Is it possible play video from remote download video link.
For example I have link http://vidrack-media.s3.amazonaws.com/student_47e96b83-989e-437a-8953-0d068308e25f.mp4
I wanna render any video player where I can watch this video.
Yes you can, in nearly every player.
<video width="320" height="240" controls>
<source src="http://vidrack-media.s3.amazonaws.com/student_47e96b83-989e-437a-8953-0d068308e25f.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
These are my code snippets which I've tried but I just get an error message that I need a Plugin
<embed src="eria.mp4" height="50%" width="100%" controls>
You don't need any plugin in HTML5. But the syntax is a bit different:
<video width="100%" height="50%" controls>
<source src="eria.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
The <embed> tag defines a container for an external application or interactive content (a plug-in).Simple words it requires a plugin to run external application which is missing from your browser.
Use HTML5 video tag instead
<video height="50%" width="100%" controls>
<source src="eria.mp4" type="video/mp4">
<source src="eria.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
To watch videos in an HTML5 web player requires us to add the source of the video in the HTML code like this:
<video id="example" class="video" controls preload="none" width="500" height="300"
poster="abc.jpg" data-setup="{}">
<source src="../87D645D1d01.ogv" type='video/ogg' />
</video>
So is there any way with which we can browse a media file in our local file system irrespective of the OS and then add the pah to the SRC: part of video element like we do it in any desktop based video players and then play it?
Regards.
Anuj.
I tried the following HTML for displaying a video. But I am not able to see video.
Its only loading the video, but not playing it. I'm using 'video.js' a JavaScript and CSS library which manipulates the video tag for a consistent UI.
If I am missing something please tell me.
Here is my code:
<video id="my_video_1" class="video-js vjs-default-skin" controls
preload="auto" width="640" height="264" poster="my_video_poster.png"
data-setup="{}" >
<source src="scroll_index.mp4" type='video/mp4'>
<source src="scroll_index.webm" type='video/webm'>
</video>
I have included above code in body tag and also included references to video.js and video.css in the head tag.
I don't know what browser you are testing with, perhaps it doesn't support the html5 video tag, but regarding your comment, I don't think so :)
However, you have neither set the controls attribute to make the control panel appear so user can manually start (and control) the video, nor set the autoplay attribute so that the video will play as soon as it is ready, so I suggest adding these attributes:
<video id="my_video_1" class="video-js vjs-default-skin" controls
preload="auto" width="640" height="264" poster="my_video_poster.png"
autoplay="autoplay" controls="controls"
data-setup="{}">
<source src="scroll_index.mp4" type='video/mp4'>
<source src="scroll_index.webm" type='video/webm'>
</video>