Apparently I'm a total noob when it comes to web development. I just need help making a simple html file that embeds a video. I can't use youtube. I just need to embed the local file and it's not working.
<!DOCTYPE html>
<head>
<title>Testing</title>
</head>
<body>
<video id="0" controls width="502" height="479">
<source src="OWA tutorial.webm" type='video/webm'>
<source src="OWA tutorial.mp4" type='video/mp4'>
<p>Video is not visible, most likely your browser does not support HTML5 video</p>
</video>
</body>
</html>
This doesn't work. "OWA tutorial.mp4" is in the same folder as the html file. What am I doing wrong?
Tried this:
<!DOCTYPE html>
<head>
<title>Testing</title>
</head>
<body>
<video id="0" width="502" height="479" controls>
<source src="loop.ogv" type="video/ogg">
<p>Video is not visible, most likely your browser does not support HTML5 video</p>
</video>
</body>
</html>
Worked well. Just replace the ogg with mp4, in your case.
Edit:
I'm not saying that you should use .ogv instead of .mp4.
I just used it as example because I've tried with a .ogv file (just because I don't have a .mp4 file here right now).
Your code should work if you copy mine and just replace the "loop.ogv" with your filename and the "video/ogg" with "video/mp4".
Sorry if it was misleading.
Related
I'm trying to use subtitles with my HTML5 video tag, but I can't get this to work.
I think the issue is that the video source isn't a local file.
Does anyone know how I can get around this?
<html>
<head>
<style id="stndz-style"></style>
<meta name="viewport" content="width=device-width">
</head>
<body>
<video id="video" controls autoplay="" name="media">
<source src="http://localhost:8888/" type="video/mp4">
<track label="Dutch" kind="subtitles" srclang="nl" src="/home/ubuntu/Desktop/scripts/example.vtt" default>
</video>
</body>
</html>
and this is my example.vtt:
WEBVTT
00:01.000 --> 00:04.000
Never drink liquid nitrogen.
00:05.000 --> 00:09.000
- It will perforate your stomach.
- You could die.
Turns out that cromium not letting me use local files was the issue. So my workaround is to run chromium like this:
chromium --allow-file-access-from-files
I am trying to play a video on HTML using video tag. However, it is not playing at all. I'm thinking maybe it is the path problem.
https://imgur.com/sGyzvbx "screenshot of the file path"
I tried to use multiple video formats like WebM, mp4, and avi to test it out. However, the result is the same.
<video width="420" height="345" src="../test.mp4">
</video>
Try like this. video inside source tag. In your code you are miss controls. Html video can not play automatically. so we need control
<!DOCTYPE html>
<html>
<body>
<video width="400" controls>
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
</video>
<video width="400" controls src="../video.mp4"></video>
</body>
</html>
I am trying to use the track element with audio element but it is not working for me, can someone give me some guidance
Looking in my console I dont see an error but i see this
Resource interpreted as TextTrack but transferred with MIME type text/plain: "http://127.0.0.1/output_trim.vtt".
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title of the document</title>
</head>
<body>
<audio width="900" height="900" controls >
<source src="output_trim.ogg" type="audio/ogg">
<track label="English" kind="subtitles" srclang="en" src="http://127.0.0.1/output_trim.vtt" default>
</video>
</body>
</html>
You can try loading a webm audio file as the src attribute for a video element. Then you can set the length and width attributes of the video element so it looks like a music player. I've done this using the URL.createObjectURL() to play local audio with .vtt files on my drive but I'm not sure about other use cases.
I am a beginner in web development. I have a video file in my web page.
I want to play that video in a new tab.
I gave the target="_blank" attribute into my video tag but it's still not working.
Is there is any other way to play videos in a new tab?
Please help me!
Thank you!!
Do you try this way?
<!DOCTYPE html>
<html>
<body>
<h2>Click the Link to Play the Object</h2>
Play a video file
</body>
</html>
Or you can create a blank page with following code:
<!DOCTYPE html>
<html>
<body>
<video width="90%" height="90%" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
</body>
</html>
And then link to that page:
See the video
<!DOCTYPE HTML>
<html>
<body>
<video width="320" height="240" controls="controls">
<source src="tutorial.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</body>
</html>
this tutorial.mps is stored in the same folder but I am not able to open that video I got that sentence Your browser does not support the video tag.
See this link about media format browser compatibility. The firefox doesn't support mp4 yet. Convert the file e.g. to ogg and add an additional source-tag.