How to disable auto-play for local video in iframe - html

How to disable auto-play for video when src is from my local pc?
<iframe width="465" height="315" src="videos/example.mp4"></iframe>
I have tried the following, but it doesn't work:
src="videos/example.mp4?autoplay=0"
src="videos/example.mp4?autoplay=false"
src="videos/example.mp4?autostart=0"
src="videos/example.mp4?autostart=false"

If you are using HTML5, using the Video tag is suitable for this purpose.
You can use the Video Tag this way for no autoplay:
<video width="320" height="240" controls>
<source src="videos/example.mp4" type="video/mp4">
</video>
To enable auto-play,
<video width="320" height="240" controls autoplay>
<source src="videos/example.mp4" type="video/mp4">
</video>

Try This Code for disable auto play video.
Its Working . Please Vote if your are done with this
<div class="embed-responsive embed-responsive-16by9">
<video controls="true" class="embed-responsive-item">
<source src="example.mp4" type="video/mp4" />
</video>
</div>

if you still need to use an iframe, add a sandbox
<iframe width="465" height="315" src="videos/example.mp4" sandbox></iframe>

Replace the iframe for this:
<video class="video-fluid z-depth-1" loop controls muted>
<source src="videos/example.mp4" type="video/mp4" />
</video>

What do you think about video tag ? If you don't have to use iframe tag you can use video tag instead.
<video width="500" height="345" src="hey.mp4" />
You should not use autoplay attribute in your video tag to disable autoplay.

You can use the Video Tag this way for no autoplay:
<iframe allowfullscreen="" frameborder="0" sandbox="" width="490" height="275" src=".../n1.mp4"></iframe>

Just replace
<iframe width="465" height="315" src="videos/example.mp4"></iframe>
by
<video src="videos/example.mp4" controls></video>
Here is an example using bootstrap 4:
<div class="embed-responsive embed-responsive-4by3">
<video src="videos/example.mp4" controls></video>
</div>

Try it.
src="videos/example.mp4?autoplay=1"

If you are using iFrame tag, remove the autoplay form the autoplay from allow property
<iframe
title=""
class="rounded-2xl w-full"
height="370"
src="Demo.mp4"
allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen
></iframe>

You can set the source of the player as blank string on loading the page, in this way you don't have to switch to video tag.
var player = document.getElementById("video-player");
player.src = "";
When you want to play a video, just change its src attribute, for example:
function play(source){
player.src = source;
}

I've tried all the possible solutions but nothing worked for local video bindings. I believe best solution would be to fix using jQuery if you still wants to use iframes.
$(document).ready(function () {
var ownVideos = $("iframe");
$.each(ownVideos, function (i, video) {
var frameContent = $(video).contents().find('body').html();
if (frameContent) {
$(video).contents().find('body').html(frameContent.replace("autoplay", ""));
}
});
});
Note: It'll find all the iframes on document ready and loop through each iframe contents and replace/remove autoplay attribute. This solution can be use anywhere in your project. If you would like to do for specific element then use the code under $.each function and replace $(video) with your iframe element id like $("#myIFrameId").

<iframe width="420" height="315"
src="https://www.youtube.com/embed/aNOgO7aNslo?rel=0">
</iframe>
You're supposed to put the characters ?rel=0 after the YouTube video unique link and before the quotations. it worked for me

Related

Prismic embedded url for a video does not load

<video
controls
className={"w-full h-full object-contain"}
loop
autoPlay
muted
>
<source
src={videoUrl.embed_url}
type="video/mp4"
className={"relative z-[100000]"}
/>
</video>
If I put static(local) video src -> it works. But external video URL - doesn't.
What can cause this problem?
i would try creating a frame. and sorry im not sure of the cause of the problem
<iframe width="420" height="315" src="https://www.youtube.com"> </iframe>
Try this one:
<video
controls
className="w-full h-full object-contain"
loop
autoPlay=""
muted="muted"
playsinline=""
>
<source
src={videoUrl.embed_url}
type="video/mp4"
className={"relative z-[100000]"}
/>
</video>

How can i set up autoplay, loop and multiple songs after one is finished?

Thats what ive done so far
<div>
<iframe src="/music/song1.mp3" style="position:absolute;top:0;left:0;width:100%;height:100%;" width="1400" height="900" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>
</div>
Thanks
Use the <audio> html element and add autoplay loop
<audio autoplay loop controls>
<source src="/music/song1.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
See more about <audio> here

How to enable autoplay on Instagram embedded video?

I have a simple html page. I dont want to use javascript or call Instagram API.
I would like to enable AutoPlay and Loop on Instagram video like we have with youtube:
<iframe width="400" height="300" src="https://www.youtube.com/embed/[ID]?loop=1&controls=0&autoplay=1" frameborder="0"></iframe>
Following the Instagram Help instructions:
https://help.instagram.com/513918941996087
And for Instagram:
<iframe width="400" height="300" src="https://www.instagram.com/p/[ID]/embed/" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
But I dont find a way to enable Autoplay and loop. Do you have an Idea?
When ready call:
$('body > div > div.Content.EmbedFrame > div > div > div.fXIG0').click()

restrict the size of video in a site

We are using following code to display video in a site.
<a width="300" height="300" href="http://www.youtube.com/embed/FEqXWwPFusI">
Video is displaying by covering entire monitor size.
If i click on menu_video.jpg image, it's displaying video with full size.
But I want to display the video for specific space. [width ="300" height="300" ]
Suggest me to find solution.
Try This
<iframe src="http://www.youtube.com/embed/FEqXWwPFusI" width="300" height="300"></iframe>
You should use video tag . try this:
<video width="400" height="400" controls>
<source src="video file" type="video/mp4">
<source src="video file" type="video/ogg">
</video>
Try this code istead
<video width="300" height="300" controls>
<source src="http://www.youtube.com/embed/FEqXWwPFusI" type="video/mp4">
Your browser does not support HTML5 video.
</video>
Source link
or try iframe
<iframe type="text/html"
width="300"
height="300"
src="http://www.youtube.com/embed/FEqXWwPFusI"
frameborder="0">
</iframe>
or refer this question for more

html5 video m3u8: How to auto play the video?

<video id="videoHTML5" class="video" width="100%" height="400" poster="img/poster.png" autoplay controls>
<source src="http://IP/live/stage.stream/playlist.m3u8" >
</video>
<script>
var vdo = document.getElementById('videoHTML5');
vdo.src = 'http://IP/live/stage.stream/playlist.m3u8';
vdo.load();
vdo.play();
</script>
NEVER starts ! I need to press the PLAY button on ipad and adroid !
Any idea on how to autostart an m3u8 video ?
reagards
you can try autoplay="true" in your code