I'm requesting this chunk of html from a mysql database:
<p>Hello.<br><video src="video/hi.mp4" width=100% height=100% autoplay="autoplay"></video>
It displays, but won't autoplay. On a static HTML page it goes off without a hitch.
The request comes from an ajax call for a matching keyword that is being typed into a input bar.
Any ideas?
Only thing I can imagine is that the browser has not finished loading the page and or not getting a onload(). Can you start the video using a script?
<video id="video" src="video/hi.mp4" autoplay ></video>
<script>
document.getElementById("video").play();
</script>
Aren't some quotes or attributes missing?
<video src="video/hi.mp4" style="width:100%; height=100%;" autoplay="autoplay"></video> ?
Your web browser doesn't know that the HTML came from an SQL database, so it's not likely that it behaves differently in the two cases. I'm inclined to assume that there is some other problem with the page.
What are the URLs of the static and dynamic pages? Does the relative URL "video/hi.mp4" resolve to the address of your video correctly in both cases?
According to http://pauljacobson.org/2010/01/22/firefox-and-its-limited-html-5-video-support/, Firefox only supports ogg formatted videos.
Fixed mine by using autoPlay instead of autoplay.
Related
I'm wanting a video to play automatically once it loads on a page. The video has no sound so shouldn't annoy the user too much.
The official YouTube answer for this query is to add &autoplay=1immediately after the video ID, and while that works in this CodePen test, it isn't working on my actual website page.
Elsewhere on Stack Overflow I've seen someone suggest that replacing the & with ? would work, however, doesn't work for me. (It doesn't break the video, it just still doesn't autoplay).
My embedded YouTube video
<div class="background-video" style="background-color: #ebebeb; height: 655px;">
<iframe width="100%" height="655" src="https://www.youtube.com/embed/bdw7V0vzQCs?&autoplay=1&rel=0&controls=0&showinfo=0" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>
</div>
The site is built on Wordpress and is currently hosted locally on a MAMP server.
You should put ? in front of autoplay only if it's the first attribut added to your youtube url, otherwise you should use &.
Like so : your-url.com?autoplay=1 or your-url.com?key=value&autoplay=1
In your case you have ?& that should be replaced by only ?.
Your code is correct, i check video is auto playing create a new php file and check adding your code.
May be have some problem with site.
I'm using the following iframe in my HTML code:
<iframe src="<iframeurl>">?autoplay=1" frameborder="0" allowfullscreen></iframe>
On iPhone with iOS10 this doesn't autoplay. I'm getting the red play button and stuff. On windows chrome and others all works fine autoplay starts correctly. But not with the iphone.
Is there anything I could do in javascript or by manipulating the URL to make this autoplay? I'm aware that Apple used to disallow autoplay before iOS10 so maybe I'm doing something wrong here..
You're experiencing this because Apple doesn't allow embedded media to play automatically — the user always initiates playback.
This is mentioned in YouTube's IFrame Player API documentation as well. And no, I don't think you can and should override this since that is a bad practice.
Just add the play trigger to onClick and then execute call the click event from an AJAX response.
Should do the trick ;)
It is not that iOS prevents any video from autoplaying (at least not so since iOS 10), but it is unmuted videos that are prevented from playing without user interaction. So if you embed a YouTube video with muted=1 appended to the URL, autoplay works again.
P.S. the muted parameter is not documented for the YouTube embedded players. It is nowhere to be found in the official doc: https://developers.google.com/youtube/player_parameters. Yet it has been working for quite a while. If you worry it may not work someday, you can take the programmatic approach via the iframe API: first mute the video and then play it when the ready event is emitted.
putting this in config.xml worked for me:
<allow-navigation href="*://*youtube.com" />
Just as the title says. I've been working on a site and had added a big html video for the main page.
I looked over online...myme types checked, h264 encoding checked. I looked over old versions of the file i've been working on and noticed an old pure HTML file which loaded the video in all browsers with no problem (which I guess discards any encoding or video quality issues)
It all was working neat. Even displaying in firefox, chrome an IE. BUT for some reason the video does not load in IE whenever the file extension for the page it's on is .PHP. To be precise, whenever i try it from my LOCALHOST (XAMP with Apache server)
I also checked the dev tools and under network it does show it as the right content type and no error whatsoever (getting normal 200 result)
Here's the snippet of the video tag used:
<div id="video_container">
<video autoplay loop poster="video.jpg" id="header_vid">
<source src="imagenes/video.mp4" type="video/mp4">
</video>
LOL, and just noticed...not even the poster image is showing in IE...wtf.
I'm so confused, could anyone enlighten me a bit please? Could it be something related to the path used? been digging around the net for days _
Check if your url is formed properly when you are using .php extension on IE. Same issue addressed quite a few time here.
mp4 from PHP - Not playing in HTML5 Video tag ||
Play mp4 file through php in HTML5 Video Tag in Chrome?
I notice IE doesn't like the properties without value, so try
<video autoplay="" loop="" poster="video.jpg" id="header_vid">
I'm trying to create a page on my WordPress site using an HTML file. When I enter the code and preview the page, the title and footer are displayed, with the message "No HTML5 canvas!" in between them. I have this line of code in my script, which as far as I understand should be creating the canvas:
<canvas id="screen" name="screen" width=480 height=480 class="noselect">No HTML5 canvas!
</canvas>
This is my first time working with HTML, apologies if I'm missing something. Any help anyone can provide would be appreciated.
your code is working fine, here is a fiddle to prove it, the problem might be your browser
<canvas id="screen" name="screen" width=480 height=480 class="noselect">No HTML5 canvas!
</canvas>
check out this page for a list of browsers that support html 5 canvas
Contacted WordPress support and it turns out the site simply doesn't support Canvas.
Could you not code your html file the way you want with your canvas tag in it, upload it to an external site and then in your WordPress site use an iFrame and set the src to be your html file with the canvas tag? This might be a way around your problem
<iframe src="http://www.google.com"></iframe>
Or either try this http://www.learnopengles.com/how-to-embed-webgl-into-a-wordpress-post/
According to this demo, it SHOULD be possible to loop video in Chrome
http://www.w3schools.com/html5/tryit.asp?filename=tryhtml5_video_loop
but I can't seem to get it working when I simply apply
loop="loop"
to my video tag.
Does anyone have a solution?
I've seen that this post is rather old or might be resolved. In case you are just wondering let me point to a different threat.
I think the reason why you can't loop the video in Chrome is that for chrome the video only loops when served up by a server that understands partial content requests.
More on that here: HTML5 video will not loop
I thought that might help.
In html5 the 'loop' attribute is a Boolean so you should write:
loop='true'