I have a background video which plays offline as it's expected but it's not playing online.
this is the html code:
<video autoplay poster="vid/TD.jpg" id="bgVid" loop>
<source src="vid/TD.mp4" type="video/mp4">
</source>
</video>
this is the actual website itself if you want to see it so for your self.
Well, your markup looks correct, but the video is coming through as a 404. Double check your path to the video and the capitalization of the file name, too. Resolve that, and I bet your video starts working.
Related
I am creating a HTML-Page for my local PC for fun and want to implement a video player.
I searched for how to do it and found something which I applied to my page:
<video width="400" controls>
<source src="Videos/test.mp4" type="video/mp4"><source>
</video>
I even tried to embed the source attribute:
<video width="400" src="Videos/test.mp4" controls></video>
Both end up creating a video frame with play button but nothing is played. Even when I click on the play button nothing reacts to my click.
Does anyone unterstand why?
I think it's because you are using <source> tag twice. And you can't use an empty <source>. It should be like :
<video width="400" controls>
<source src="Videos/test.mp4" type="video/mp4">
</video>
reference : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video
You should check the DevTools (F12) network tab for any errors while fetching the video file. Probably your answer will be there.
Most likely, this has something to do with the file path you've entered in the [src] attribute.
From https://www.w3schools.com/tags/att_video_src.asp:
Possible values:
An absolute URL - points to another web site (like
src="http://www.example.com/movie.ogg")
A relative URL - points to a
file within a web site (like src="movie.ogg")
Try this way it may be work if your src path not correct
Videos/test.mp4 => /Videos/test.mp4
<video width="400" controls>
<source src="/Videos/test.mp4" type="video/mp4"><source>
</video>
I'm trying to add video to a portfolio site I'm working on, but it has this choppy quality to it, like it's lacking anti-aliasing.
Or it could be something else.. Does anybody have any clues?
It looks fine when I play it in a video player.
(Open the image in full view to see artifacts better)
Here's the code for the video tag:
<video width="100%" class="videoStyle" autoplay muted loop>
<source src="video/01-02.mov" type="video/mp4">
Your browser does not support the video tag.
</video>
I tried this code but video is just continuing to load, not to playing.
I also tried video codec H-264 but that is not working.
Next I tried to convert mp4 video to webm but that did not help either
Can anyone tell me how to do this using jquery and ajax?
<video controls muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Did you checked by drag and drop to open the movie.mp4 or the movie.ogg file?
If the file does not work by simply opening it using a browser, it might be the file's problem, not the code or the browser.
For the file type support per browsers please refer the "Can I use?" pages:
MPEG-4/H.264
Ogg/Theora
First I made a screen recording as a video I would like to display.
Than I uploaded the video to VLC to convert the video.
I made one MP4 and a fallback for OGG.
I then moved the videos to my dropbox account so I can host them there.I right clicked and got the link to each video from dropbox. I am trying to use the links as the src in the video tags.
<video width="400" controls>
<source src="https://www.dropbox.com/s/m7emkfs994sgm5g/Untitled.m4v?dl=0" type="video/mp4">
<source src="https://www.dropbox.com/s/9owwdbm8p0nz1f0/oggguntitled.ogg?dl=0" type="video/ogg">
</video>
Even though I told VLC to convert it to MPV, the file extension is m4v.. Is that the same thing?
The video just shows blank. Not getting any errors either.Not sure what I missed.
The following Fixed it for me.
I made two changes:
change dl=0 at the end of your dropbox link to dl=1. I believe this makes it a download link instead of a page to view a download link.
Due to a bug in chrome on OSX certain mp4 files will fail to play correctly (some kind of graphics acceleration issue), but it won't fall back to the ogv. For this reason, i have placed the ogv as first since it will work on OSX-chrome, and platforms that don't support it should fall back to the mp4.
<video width="400" controls>
<source src="https://www.dropbox.com/s/9owwdbm8p0nz1f0/oggguntitled.ogg?dl=1" type="video/ogg">
<source src="https://www.dropbox.com/s/m7emkfs994sgm5g/Untitled.m4v?dl=1" type="video/mp4">
</video>
I have a website where I am trying to show a video.I have 2 mp4 format videos and both are ok(not corrupted).When I try to show these two using tag in html5 one is working but another is not working.
I have used the code given below
<video width="320" height="240" controls>
<source src="video/v1.mp4" type="video/mp4">
<source src="video/v1.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
<video width="320" height="240" controls>
<source src="video/theme.mp4" type="video/mp4">
<source src="video/theme.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
here,in firefox first one is working great but the next one shows the error "No video with supported format and mime type found".In chrome first one is ok and second one only shows audio.
Please help me to solve this.
Thanks in advance.
Check to see if video/theme.mp4 is accessible in the browser. View source and try clicking the link or see if it is loaded in the resources in the development tools. It sounds like Firefox can't find/read theme.mp4 or theme.ogg so is displaying the error message. Chrome can't find theme.mp4 either but is reading it's MIME Type it as audio/ogg rather than video/ogg.
You could try this page and see if it helps, the MDN always has useful stuff:
https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats