I am trying to style a audio player that generates when the user clicks a music file.
In developer tool in chrome, the structure is like the following
<embed src='music.wav' >
#document
<html>
<body>
<video controls autoplay name='media'>
<source src='music.wav' type='audio/x-wav'>
</video>
<body>
<html>
</embed>
How do I style the video player that chrome generated in this case?? Thanks a lot!
Related
http://flynautwork.com/newfountain/index.php
I have used HTML Video tag on home page for video which is working on all pc and laptops and even on android Devices but nothing is showing on iPhone devices . Need Help !!
Please Try this I think should be work:-
<video id="myVideo" loop="" muted="" autoplay="" playsinline="" webkit-playsinline="">
<source src="fl-admin/images/fw-home.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
I'm looking to display a linked image to show when my video isn't compatible.
My code is as follows:
<video controls poster="/sites/default/files/image/CRM-Systems-Video.png">
<source src="/sites/default/files/image/CRM-Systems-Video.ogv" type="video/ogg">
<source src="/sites/default/files/image/CRM-Systems-Video.mp4" type="video/mp4">
<a href="http://content.workbooks.com/free-trial-workbooks-crm?utm_source=Homepage&utm_medium=laptopimage&utm_campaign=laptophomepage">
<img src="http://www.workbooks.com/sites/default/files/image/crm-system-image.png" title="CRM System image">
</a>
</video>
However when I use Browser Stack to test IE8 (non compatible with <video>) no image is shown? Is this due to the link?
Browser shots link: http://www.browserstack.com/screenshots/663ccadc9d1c2a3aa880fb4e1ef111c4eb386c79
Adding the following to the start of your <head> will do it:
<script type="text/javascript">
document.createElement("video");
</script>
This tricks IE8 into recognising the <video> element, as IE does not display any tags it does not recognise. I tested this and the link appeared, although <source> files are ignored.
Heres an example (you should see nothing on modern browsers, but browsers lacking video support will display a text):
<script type="text/javascript">
document.createElement("video");
</script>
<video>
You are on an older browser
</video>
I have an mp4-video on my computer (a Mac). When I drag the file to a browser window in Firefox, the video plays. So obviously all necessary plugins are installed.
But when I try to embed the video into a XHTML file with the <object>, <video> and/or <embed> tags, using code from this site and elsewhere on the web, I see a message that no video was found in a supported format or MIME-type.
How can I embed a local video into a local XHTML file, so it shows up inside an XHTML page with text surrounding it?
Current code sample:
<video width="640" height="360" controls="controls">
<source src="/path/to/Video%20File.mp4" type="video/mp4" />
</video>
Result:
does the following work for you?
<video width="480" height="320" controls="controls">
<source src="http://serverIP_or_domain/location_of_video.mp4" type="video/mp4">
</video>
Okay, what works is:
<embed src="/path/to/Video%20File.mp4" type="video/mp4" />
I have two iframe's below. One works in safari and one does not. I cannot seem to figure out why this is happening.
If the iframe will cause problems with soultion, can you recommend a solution for embedding a web page within a web page?
Thanks!!!
This works on Safari:
<html>
<head>
<title>iframe Test</title>
</head>
<body>
<iframe src="http://ebay.com" width="100%" height="400"></iframe>
</body>
</html>
This does not work on Safari
<html>
<head>
<title>iframe Test</title>
</head>
<body>
<iframe src="http://public.bullhornstaffing.com/JobBoard/Standard/default.cfm?privateLabelID=7327" width="100%" height="400"></iframe>
</body>
</html>
The URL you listed requires four cookies to be installed before loading the page. Safari doesn't load the cookies when accessed via an iframe. If you open the url directly in another tab - it loads fine and then refreshing the iframe tab loads the iframe without error. Delete the cookies and the iframe doesn't load again. The cookies in part direct a redirect.
This is a bug on the iframe target side of the equation. Its not loading the cookies into safari via the iframe. It loads fine in Chrome.
I have an asp.net MVC 4 controller that provides the mp4,
public ActionResult GetVideoForEvent(int eventId)
{
var videoPath = "pathToVideo";
var videoFileInfo = new FileInfo(videoPath);
return new RangeFilePathResult("video/mp4", videoFileInfo.FullName, videoFileInfo.LastWriteTimeUtc, videoFileInfo.Length);
}
And a video player in a partial view,
#model int
<link href="https://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="https://vjs.zencdn.net/c/video.js"></script>
<video class="video-js vjs-default-skin" controls autoplay preload="none" width="320" height="256" data-setup="{}" >
<source type="video/mp4" src="#Url.Action("GetVideoForEvent", new { eventId = Model})">
</video>
This works for ie8 and ie10 but not ie9.
The problem only occurs when using videojs, if I used the just the html5 <video> the video plays.
Also if I change the source to be a direct link to a file on iis, the video plays.
Output from ie9 console:
LOG:
LOG: Video Error[object Object]
What is causing the error when using videojs and how can I fix it?
I have found a workaround. By only using videojs if the browser is ie 8, the video plays on ie8, 9, 10 and Google chrome.
The video player does look different on each browser though.
<!--[if lt IE 9]>
<link href="https://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
<script src="https://vjs.zencdn.net/c/video.js"></script>
<![endif]-->
I had the same problem. Check your MIME types for mp4 files are correct and that the video is encoded correctly.
I found the debugging guide on this website to be very helpful.