I have a webpage that has an Iframe that has a source that contains a flash video embedded in it.
If I open it on a android phone the video does not auto start. I have to tap to start the video.
I need to make it autostart. Does anyone know how I can do it. I have no control over the original source of the iframe.
Can anyone help.
<!DOCTYPE html>
<html>
<body>
<iframe src="http://www.tvguide.co.uk/tv-stream/?ch=bbc+1" width="1009" height="566">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
If you open this in a browser the video will play. However on an adroid device you have to hit play.
I want it to automatically play.
Related
i am looking for autoplay an audio in loop without getting blocked by browser.
Code :
<audio id="audio1" src="assest/sound/1.mp3" autoplay="" />
<script>
a = document.getElementById('audio1');
a.onended = function(){setTimeout("a.play()", 1000)}
</script>
My current code working on firefox but in default it is blocked, i have to allow autoplay manually so it can play the audio and in other side in chrome the audio is not even playing.
Edited :
Iframe code :
<iframe src="assest/sound/1.mp3" allow="autoplay" style="display:none" id="iframeAudio">
</iframe>
I have even tried iframe auto play code but it still not working with chrome. iframe code automatically trigger auto download of audio file.
Any solution for this?
WITH HTML
<audio controls autoplay loop hidden>
<source src="assest/sound/1.mp3" type="audio/mpeg">
</audio>
Please have a look at this document to know what is the problem that you're facing: https://developer.mozilla.org/en-US/docs/Web/Media/Autoplay_guide.
As described in the document:
As a general rule, you can assume that media will be allowed to autoplay only if at least one of the following is true:
The audio is muted or its volume is set to 0
The user has interacted with the site (by clicking, tapping, pressing keys, etc.)
If the site has been allowlisted; this may happen either automatically if the browser determines that the user engages with media frequently, or manually through preferences or other user interface features
If the autoplay feature policy is used to grant autoplay support to an and its document.
I think a reasonable way is to let users interact with your site first. Eg:
Show an in-page popup and the user clicks to close it;
Ask users whether they want to listen to music or not;
...
After they interacted with your site, you can run the script to play the audio without browser blocking.
I have a .webm video that I am dynamically setting as the source for the video tag.
vidPlayer = document.getElementById("player");
vidPlayer.src = videoPath;
The corresponding HTML:
<body>
<video id="player" class="video-player"></video>
</body>
This is working perfectly on the web browser but when I view this on my mobile, I get a white screen.
I checked the elements tab in the developer tools if different HTML was getting rendered, but it wasn't.
However, in the network tab for chrome web, there is a call made to fetch the video but the same does not happen for chrome android.
I am running this code on localhost.
Can anybody tell me what I am doing wrong or why this is happening?
So, apparently, if your video does not have controls enabled, then for mobile browsers, the user must interact(tap or swipe on the screen) for the video to be visible on the screen.
With controls enabled the video is visible from the start.
Could someone please help me to figure out how to use a placeholder image to open a youtube video on mobile so that if the user clicks the image on the html page in safari on iphone, the video automatically plays fullscreen (note: on iphone the video would automatically go fullscreen in this instance, just as when you click an embedded youtube iframe).
Thank you!
Does the normal syntax below give you some sort of issue? It looks ok on my emulator... :
<!DOCTYPE html>
<html>
<body>
<p>Full Screen</p>
</body>
</html>
I'm currently trying to incorporate a full screen video BG in my home slider (via Revolution SLider, a WP plugin which supports HTML5 video).
The video loads fine in FF and Chrome, but I get nothing but the loading .gif and a black screen in Safari - I've got both .mp4 and .ogv available and linked, so I know the correct format is there.
Any ideas/solutions would be massively appreciated!
Use the specific video format safari uses.
<!doctype html>
<html>
<head>
<title>Multi-Scheme Video Player</title>
</head>
<body>
<video controls autoplay >
<source src="http://HttpLiveStream.m3u8">
<source src="rtsp://LegacyStream.3gp">
<source src="http://ProgressiveDownload.m4v">
</video>
</body>
</html>
Here you will find things properly about video support by particular browser CLICK HERE
Recently, I've found that Google Music's new iOS specific web app (http://music.google.com) has the ability to "hijack" the native iOS iPod's music controls (double tap your home screen and use those pause, play, next, prev buttons while playing Google Music).
I had no idea that this was possible through a web app and have had trouble finding any examples or clues on how to achieve this through javascript. Does anyone have an idea?
iPhone is a WebKit browser therefore it supports the <audio> tag. All you have to do is throw in an <audio> tag with it's source linked to a playable audio format on WebKit (.aac for example) and you will have control over the audio file. You'll also notice an indicator in the top right of the screen to the right of your iPhone clock/time.
Here's all the info:
https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html
Here's an example piece of code:
<!DOCTYPE html>
<html>
<head>
<title>Multi-Source Audio Player</title>
</head>
<body>
<audio controls autoplay >
<source src="http://Example.com/path/MyAudio.m4a">
<source src="http://Example.com/path/MyAudio.oga">
<source src="http://Example.com/path/MyAudio.wav">
</audio>
</body>
</html>
Here's iOS specific info:
https://developer.apple.com/library/archive/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/Device-SpecificConsiderations/Device-SpecificConsiderations.html#//apple_ref/doc/uid/TP40009523-CH5-SW1