I'm using Bootstrap 4. My embedded video plays automatically when the page loads. My code is:
<div class="embed-responsive embed-responsive-16by9 hoverable video-1 video-align">
<iframe class="embed-responsive-item" src="myvideo.mp4" allowfullscreen></iframe>
</div>
How do I stop the auto-play, please?
Don't use an iframe; use the video tag. An inline frame is there to display another document on the page and is automatically rendered when the page is loaded. In case of a video, it is automatically played.
You can use the autoplay="false" like this:
<video width="640" height="480" controls="controls" type="video/mp4" preload="none">
<source src="myvideo.mp4" autoplay="false">
Your browser does not support the video tag.
</video>
That should be it.
Use this additional parameter for the iframe:
autoplay="false"
Related
There are many solutions out there on how to make youtube/vimeo autoplay a video but they don't seem to work on a local video:
<template>
<section id="vision" class="vision">
<iframe src="videos/cgi_neutral.mp4?autoplay=1" allow="autoplay" allowfullscreen="true"></iframe>
</section>
</template>
This does not autoplay.
First, instead of using an iframe, use a <video> tag. (Because its self-hosted on your website, no need to use an iframe) To make it autoplay, just add the "autoplay" attribute.
For Example:
<video width="320" height="240" controls autoplay>
<source src="movie.mp4" type="video/mp4">
</video>
I created my html5 video section, but i'm using it to display video-ads before every video on my page.
The problem is that i want to show the video with only a big play button and the audio button, without the autostart (so the video can be played on every devices).
How to modify it?
My Code:
<video id="advvideo" controls width="100%" height="auto">
<source src="images/videos/promo.mp4" type="video/mp4" >
<source src="images/videos/promo.ogg" type="video/ogg">
video not supported
</video>
you can't control controls attribute of html5 <video> tag to change play button style.
For big play button you can upload your ad in youtube and use that youtube video with object or embed or iframe tag.
I prefer <iframe> tag.
Ex:
<iframe width="425" height="344" src="https://www.youtube.com/embed/F9Bo89m2f6g" frameborder="0" allowfullscreen></iframe>
I currently have a flex video on my page that starts playing when the page is loaded.
How do I stop it from playing automatically?
<div class="flex-video">
<iframe width="300" height="300" src="video.mp4" frameborder="0" allowfullscreen></iframe>
</div>
If you embed your own video using iFrame then it will just play automatically. What you can do is to use a video player. You can also use the html video tag like this:
<video controls>
<source src="video.mp4" type='video/mp4'/>
</video>
YouTube allows people to embed their videos. How do I make this feature for my videos? Looking for guidance or a tutorial because I don't have a clue.
Youtube gives an iframe with src pointing to a page that contains only a video.
<iframe width="560" height="315" src="//www.youtube.com/embed/1PtR6qtdi1s" frameborder="0" allowfullscreen></iframe>
Do you see that src is equal to? http://www.youtube.com/embed/1PtR6qtdi1s
Got it?
In HTML5 you can use the video tag.
<video width="320" height="240" controls>
<source src="src/to/video.mp4" type="video/mp4">
Your browser doesn't support HTML5 VIDEO!
</video>
Change values to desired width, height, src and video type (it supports mp4, webm and ogg).
I want to play video's using the HTML5 <video> tag and fancybox, with the links directing to youtube videos?
here's my code so far
<video width="480" height="270" controls="controls" poster="../images/youtube-logo.png">
<source src="http://o-o---preferred---sn-5hn7snl7---v12---lscache8.c.youtube.com/videoplayback?upn=paJG2CcEhGw&sparams=cp%2Cgcr%2Cid%2Cip%2Cipbits%2Citag%2Cratebypass%2Csource%2Cupn%2Cexpire&fexp=906356%2C910014%2C914093%2C922401%2C920704%2C912806%2C927201%2C922403%2C925003%2C913546%2C913556%2C916805%2C920201%2C901451&ms=au&expire=1352949266&itag=46&ipbits=8&gcr=nl&sver=3&ratebypass=yes&mt=1352923510&ip=83.83.121.109&mv=m&source=youtube&key=yt1&cp=U0hUR1lPV19LUENONF9RSUFDOjBkVU41a1M4UEVp&id=d72f1d6250563a1e&signature=6C5130076CA770F67B4C797191BC0997EA040B74.10D3AEAA60E7AE1CF1D49DACF7178F3FCBBD56AE" type="video/mp4">
<source src="http://o-o---preferred---sn-5hn7snl7---v12---lscache8.c.youtube.com/videoplayback?upn=paJG2CcEhGw&sparams=cp%2Cgcr%2Cid%2Cip%2Cipbits%2Citag%2Cratebypass%2Csource%2Cupn%2Cexpire&fexp=906356%2C910014%2C914093%2C922401%2C920704%2C912806%2C927201%2C922403%2C925003%2C913546%2C913556%2C916805%2C920201%2C901451&ms=au&expire=1352949266&itag=46&ipbits=8&gcr=nl&sver=3&ratebypass=yes&mt=1352923510&ip=83.83.121.109&mv=m&source=youtube&key=yt1&cp=U0hUR1lPV19LUENONF9RSUFDOjBkVU41a1M4UEVp&id=d72f1d6250563a1e&signature=6C5130076CA770F67B4C797191BC0997EA040B74.10D3AEAA60E7AE1CF1D49DACF7178F3FCBBD56AE" type="video/ogg">
<source src="http://o-o---preferred---sn-5hn7snl7---v12---lscache8.c.youtube.com/videoplayback?upn=paJG2CcEhGw&sparams=cp%2Cgcr%2Cid%2Cip%2Cipbits%2Citag%2Cratebypass%2Csource%2Cupn%2Cexpire&fexp=906356%2C910014%2C914093%2C922401%2C920704%2C912806%2C927201%2C922403%2C925003%2C913546%2C913556%2C916805%2C920201%2C901451&ms=au&expire=1352949266&itag=46&ipbits=8&gcr=nl&sver=3&ratebypass=yes&mt=1352923510&ip=83.83.121.109&mv=m&source=youtube&key=yt1&cp=U0hUR1lPV19LUENONF9RSUFDOjBkVU41a1M4UEVp&id=d72f1d6250563a1e&signature=6C5130076CA770F67B4C797191BC0997EA040B74.10D3AEAA60E7AE1CF1D49DACF7178F3FCBBD56AE" type="video/webm">
Your browser does not support the video tag.
<iframe width="480" height="270" type="application/x-shockwave-flash"
src="http://www.youtube.com/embed/1y8dYlBWOh4?wmode=opaque">
</iframe>
</video>
As you can see i also added an iframe tag to support older browsers.
But after some tweaking i can't get fancybox to open everything, in any of the videos in the video tag??
Thanks in Advance!
The direct YouTube links are 'refreshed', although they work for a moment the next day, they no longer work, cause the links are 'broken'.
the best way to play youtube videos in html5 is like so
<iframe width="480" height="270"
src="http://www.youtube.com/embed/1y8dYlBWOh4?html5=1">
</iframe>
the html5=1 tells Youtube to use html5 to play the videos, and NOT flash!