Please check this screenshot.
My Code:
<video class="embed-responsive-item" id="video-play-normal" controls>
<source type="video/mp4" src="...path to video..."></source>
</video>
These videos are working fine is Chrome.
Related
I'm trying to embed an self hosted video into a wordpress page. This is a video hosted in the media library on the same wordpress install.
But I'm having difficulties getting the video to appear on the page, not on autoplay and with sound.
It seems to either:
appear with no play button (looks like a static image)
appear autoplaying but with no sound.
I've tried various settings on the page code to get this to appear like a regular video with a play button that's not set to autoplay but I'm stumped.
These were the settings when I came to change them
<div class="video-area">
<video width="100%" autoplay muted>
<source src="<?php the_field('video_section_video') ?>" type="video/mp4">
</video>
</div>
I then tried this:
<div class="video-area">
<video width="100%" muted="false" autoplay="false">
<source src="<?php the_field('video_section_video') ?>" type="video/mp4">
</video>
</div>
And I also tried changing the original default settings to removing autoplay and muted, but no combination of changes seems to have the effect I want.
It's either static and no option to start the video, or it plays automatically without sound. I understand browsers dont allow videos to autoplay these days with sound, but I just need it to appear like a regular video with a play button.
You are missing controls
<div class="video-area">
<video width="100%" muted="false" autoplay="false" controls>
<source src="http://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4" type="video/mp4">
</video>
For your reference: https://www.w3schools.com/html/html5_video.asp
I am building a fullscreen video for my website background that is autoplay and loop all the time. it is working well, but it takes a long time (around 3 min) to load the video.
the video is 9 MB and 1280 * 720. I tried to compress the video with many online websites but still the same problem and it affects the resolution of the video.
I am using HTML5 and programming with PHP. here is the code:
<video playsinline autoplay muted loop poster="/media/video/poster.png">
<source src="/media/video/test.webm" type="video/webm">
<source src="/media/video/test.mp4" type="video/mp4">
<source src="/media/video/test.ogg" type="video/ogg">
</video>
If you know another programming technique that could help me achieve my goal, I appreciate your help.
Place the muted attribute before the autoplay attribute like so:
<video playsinline muted autoplay loop poster="/media/video/poster.png">
<source src="/media/video/test.webm" type="video/webm">
<source src="/media/video/test.mp4" type="video/mp4">
<source src="/media/video/test.ogg" type="video/ogg">
</video>
This will greatly reduce your loading time as the audio has to be muted in order to autoplay (in IOS/Safari in particular) See caniuse.
Hope this helps
I am using VideoJS to play videos on my page, how do I remove the playback controls?
I want to auto play once the page is loaded without controls, once the playback is done I want to trigger a webservice.
any ideas on how to do this?
Michael
<video id="my-video" class="video-js" controls preload="auto" width="640" height="264" poster="images/loader.gif" data-setup="{}">
<source src="test.mp4" type='video/mp4'>
<source src="test.webm" type='video/webm'>
<p class="vjs-no-js">
To view this video please enable JavaScript, and consider upgrading to a web browser that
supports HTML5 video
</p>
</video>
http://videojs.com/
write this attribute , i think your problem will be solve
<video autoplay ...>
i've made this script:
<?php
if(!empty($dati['audio'])) { ?>
<span>
<audio id="audio_player" src="data:audio/mp3;base64,<?php echo base64_encode($dati['audio']);?>" controls="controls" autobuffer="autobuffer">
</audio>
</span>
<?php } ?>
It create an audio tag with a blob value inside..it work in every browser on pc but it won't work on some mobile browser..i've tried with external library to play audio in different way but it look like no one allow blob instead of the path of the file..someone have an idea which can help me to solve this problem?
replace data:audio/mp3 to data:audio/mpeg
This link will be useful too.
If not working. Try this onle also.
<audio id="audioFile" controls="controls" loop="loop" autoplay="autoplay" >
<source src="filename.mp3" type="audio/mpeg" />
<source src="filename.ogg" type="audio/ogg" />
</audio>
Hope it will work for you :)
I want to play the audio file while is retrieved from the mysql database as blob file in php. But when i run the file, the php file is downloaded.
Here is my code
<?php
$file_path = "H:\\uploader\\John.mp3";
?>
<audio src="<?php echo $file_path;?>" preload="auto" />
can anyone help me to solve this problem.
You're not showing any examples of what you're tried with mysql, but maybe this will point you in the right direction:
http://php.net/manual/en/pdo.lobs.php
Edit:
Try including the embed element:
<?php
$file_path = "H:\\uploader\\John.mp3";
?>
<audio controls>
<source src="<?php echo $file_path;?>" type="audio/mpeg">
<embed height="50" width="100" src="<?php echo $file_path;?>">
</audio>