I am using embed tag in Mozilla. Video start playing on page load only. Autoplay (autoplay="false") is not helping me. Can any one help me please?
Thanks in advance !
<embed id="video1" src="Wildlife.wmv" type="application/mediaplayer" autoplay="false" width="470" height="280"></embed>
This is a know bug for Chrome and Firefox. Try using another source extension, .wmv is also not valid for Mac users without Flip4mac.
Also this bug can be fixed by using <object> like this:
<object width="470" height="280" type="application/x-mplayer2">
<param name="fileName" value="Wildlife.wmv">
<param name="autostart" value="0">
</object>
The bug in the <embed> can be caused by using the wrong type, so move on to the better solution:
Best solution in this case
Then again, the best solution for using <embed> is setting the plugin url, type and autostart like this:
<embed type="video/x-ms-wmv" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" autostart="0" width="470" height="280" loop="0" src="Wildlife.wmv"></embed>
Related
I just exported a .mov file from Final Cut Pro.
I want to embed that video into my HTML.
I tried :
<object width="800" height="600"
classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
codebase="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="FRIEND.mov">
<param name="autoplay" value="true">
<param name="controller" value="false">
<embed src="FRIEND.mov" width="160" height="144"
autoplay="true" controller="false"
pluginspage="http://www.apple.com/quicktime/download/">
</embed>
</object>
I got :
Then, I tried :
<video width="800" height="600" src="FRIEND.mov" controls ></video>
I got this :
Then, when I press the play btn, I got the sound to play, but not the video. ??? Curious ?
What is the most efficient way to achieve something like that ?
First of all you can check the video format which are supported by html5 video tag from here.
.mov format does not have support by any browser.
So you need to do this with object tag. At your object tag you are using quicktime player plugin which is not exists on your browser.
install quick time player plugin to your browser. if you using chrome check this
I have a slight problem with a webpage : when I try to load a youtube video it shows a white rectangle ( I'm on firefox with win 8.1 x 64 and Yes, I did a flash player update )
Here's the code :
<object type="application/x-shockwave-flash" width="800" height="600"data="https://www.youtube.com/watch?v=jRXQsQKGqIU"><param name="movie" value="https://www.youtube.com/watch?v=jRXQsQKGqIU" /></object>
Can somebody tell me what's wrong with it ?
The other parts of the HTML code are just fine but this youtube code keeps showing me this white rectangle in my webpage instead of the video.
According to Google, the best way to embed is to use iframes:
Best practice: IFrame embeds are the recommended method for embedding
a YouTube player because the IFrame will select the appropriate player
based on the client's capabilities and available YouTube file formats.
That would look like this:
<iframe width="420" height="315" src="//www.youtube.com/embed/jRXQsQKGqIU" frameborder="0" allowfullscreen></iframe>
However, if you wish to use the Object tag, here's a working example:
<object width="640" height="390">
<param name="movie"
value="https://www.youtube.com/v/jRXQsQKGqIU?version=3&autoplay=1"></param>
<param name="allowScriptAccess" value="always"></param>
<embed src="https://www.youtube.com/v/M7lc1UVf-VE?version=3&autoplay=1"
type="application/x-shockwave-flash"
allowscriptaccess="always"
width="640" height="390"></embed>
</object>
Working JS Fiddle: http://jsfiddle.net/RAZC4/2/
https://developers.google.com/youtube/player_parameters
Maybe you can use the new code..
<iframe width="800" height="600" src="//www.youtube.com/embed/jRXQsQKGqIU" frameborder="0" allowfullscreen></iframe>
Have you made sure that your browser supports flash?
Otherwise I would suggest using the new embed code
My videos are working properly in almost every other browser except IE9. However, it may just be the configuration of IE9 that is causing this issue since on my other laptop with Windows 8 64-bit and IE10 64-bit, when i switch the browser mode to IE9, it works correctly. Here is the issue:
I am using Windows 7 64-bit, IE9 64-bit and 32-bit. My website has videos inside nested JQuery tabs. A tab is loaded at random. If one of the tabs containing a video is chosen to be initially loaded, the video shows up fine. If not, the video shows up blank, however, I am able to right-click where the video should be, select play, and then the video will play as normal and the controls appear.
Here is a link to the page that is experiencing the issue:
http://northernicefastpitch.com/index.php?page=team&team=1
Go to the Scalzitti tab, then select videos to find where the video should be displayed.
Here is my video code:
<video width="310" height="200" controls="controls">
<source src="teams/players/Scalzitti_Angela_19960603/videos/video1.mp4" type="video/mp4">
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="310" height="200">
<param name="src" value="teams/players/Scalzitti_Angela_19960603/videos/video1.mp4">
<param name="type" value="video/mp4">
<param name="controller" value="true">
<param name="autoplay" value="false">
<embed src="teams/players/Scalzitti_Angela_19960603/videos/video1.mp4" type="video/mp4" pluginspage="http://www.apple.com/quicktime/download/" width="310" height="200" controller="true" autoplay="false">
</object>
</video>
I am hosting this website on a linux Centos 6.3 server using NGINX so .htaccess files won't cause any problem. I have looked into the "IE9 HTML5 video visible only after cache clearing" post and it did not help me. I have probably tried about 30 different solutions and nothing has worked for me (which is why I am leaning towards IE9 is configured improperly on this laptop).
Please let me know if any of you are able to see the videos properly, with controls, on IE9. If it just this laptop that has the problem, I am definitely ok with that.
Thanks in advance.
John
I couldn't find any viable solution for this problem, but I did come up with a workaround. I was using this workaround only for IE, but after coming across a different problem with Chrome, I decided to use this on all browsers.
<div style="display:inline-block; margin-top:-14px; padding:5px;">
<video id="video14" width="310" height="200" style="background:#000000 url('images/play.png') no-repeat;" preload="none" controls>
<source src="videos/video1.mp4" type="video/mp4">
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="310" height="200">
<param name="src" value="videos/video1.mp4">
<param name="type" value="video/mp4">
<param name="controller" value="true">
<param name="autoplay" value="false">
<embed src="videos/video1.mp4" type="video/mp4" width="310" height="200" controller="true" autoplay="false"></embed>
</object>
</video>
<script>
document.getElementById('video14').onclick = function () {
document.getElementById('video14').play();
document.getElementById('video14').onclick = '';
document.getElementById('video14').style.background = '';
};
</script>
</div>
Above, I give my video an id and background image of a play button. I then set some javascript to play the video when clicked and also remove the onclick function as well as the background after it is clicked for the first time. I had to set preload="none" due to the issue with Chrome. Also, instead of using a background, you can use the poster attribute. If using the poster attribute, you don't need the additional javascript to remove the background.
Edit: I tried using poster attribute, but it didn't work in IE9, so sticking with the background for now. Also tried using video.js and poster but that also didn't work in IE9. In IE9, preview poster is still being displayed even with preload="none" when the tab with videos is chosen to be the default tab (default tab chosen at random). I am ok with this random occurrence though.
What's the correct way of adding a .mov file to a webpage?
I'm just adding this functionality to an existing file so I can't convert it to HTML5. The file is on the same server about 1G in size.
The client also doesn't want to use YouTube or Vimeo as it's on the homepage.
Had issues using the code in the answer provided by #haynar above (wouldn't play on Chrome), and it seems that one of the more modern ways to ensure it plays is to use the video tag
Example:
<video controls="controls" width="800" height="600" name="Video Name">
<source src="http://www.myserver.com/myvideo.mov">
</video>
This worked like a champ for my .mov file (generated from Keynote) in both Safari and Chrome, and is listed as supported in most modern browsers (The video tag is supported in Internet Explorer 9+, Firefox, Opera, Chrome, and Safari.)
Note: Will work in IE / etc.. if you use MP4 (Mov is not officially supported by those guys)
<object CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" width="320" height="256" CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">
<param name="src" value="sample.mov">
<param name="qtsrc" value="rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov">
<param name="autoplay" value="true">
<param name="loop" value="false">
<param name="controller" value="true">
<embed src="sample.mov" qtsrc="rtsp://realmedia.uic.edu/itl/ecampb5/demo_broad.mov" width="320" height="256" autoplay="true" loop="false" controller="true" pluginspage="http://www.apple.com/quicktime/"></embed>
</object>
source is the first search result of the Google
Well, if you don't want to do the work yourself (object elements aren't really all that hard), you could always use Mike Alsup's Media plugin: http://jquery.malsup.com/media/
I did looked at this question, but the asker didn't got any reply. Still, I'm giving it a try.
I want to embed a video file on a html page. The code works fine on IE but doesn't work on firefox.
The code:
<object id="WMPlay" width="640" height="480" classid="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6" codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,70" standby="Loading Microsoft Windows Media Player components..." type="application/x-oleobject">
<param name="URL" value="XYZ.wma" />
<param name="AutoStart" value="false" />
<embed name="WMplay" width="640" height="480" type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/Downloads/Contents/Products/MediaPlayer/"
src="XYZ.wma" allowchangedisplaysize="True" showcontrols="1"
autostart="false" showdisplay="1" showstatusbar="1">
</embed>
</object>
Please note that I'm not allowed to display video using any third party tool (like flash).
Can someone please tell what am I missing? Or a better solution..something which is browser independent... :)
Looks like firefox needs a plugin, check this test page:
http://plugindoc.mozdev.org/testpages/wmp11.html
That's probably an issue with .wmv extension, which is a Microsoft proprietary format.
You should convert your video to a more "web-friendly" format, and use this code to ensure cross-browser/html version compatibility:
http://camendesign.com/code/video_for_everybody
Fire fox only displays .ogg and WebM...
www.w3schools.com/tags/tag_video.asp