I'm having a problem with video.js where the video's aspect ratio is wrong (letterboxing on sides) in the video.js swf player until I toggle full screen mode. It loads with the incorrect aspect ratio, and when I go into full screen mode, it's still in the incorrect aspect ratio, but when I exit full screen mode, it goes to the correct aspect ratio. If I go back to full screen mode, it's the incorrect aspect ratio, but the correct aspect ratio remains out of full screen mode.
Anyone have any ideas?
Thanks!
Related
When I use WMP i have an option to "Zoom to fill" this fills the entire screen regardles of aspect ratio obviously with aspect ratios like 4:3 there will be some automatic cropping involved. However I cant seem to get it done using the WMP control in VB.net
If AxWindowsMediaPlayer1.playState = WMPLib.WMPPlayState.wmppsPlaying Then
AxWindowsMediaPlayer1.fullScreen = True
AxWindowsMediaPlayer1.stretchToFit = True
End If
Either one of the options shown above do zoom to fill but only as far as the aspect ratio will allow (it wont crop), meaning in the aspect ratio of 4:3 the video will play with a vertical black bar on either side, Something which if the same video is played in standalone WMP would not happen.
How do I make the image fill the entirety of the screen without any bars?
Okay I see the issue now I have mistaken the Movies & TV app for WMP. Perhaps if I get the aspect ratio from the MP4 file and then use the height of my screen to calculate the width and resize the WMP to be wider than the actual screen size litturaly pushing the two vertical bars off screen?
In light of research VCL library's are just as easy to use and are more suited to my situation
everybody seems to use pixels to determine screen size of a device, but it is not a good practice anymore. You can use bootstrap to create a responsive website, but it will fail on full hd screens, because a lot of pixels, don't mean big screen anymore.
My example:
on bigger screens, I don't want website to take the entire screen and on smaller screens I do. The easy solution is to use max-width, but it doesn't work if a device has a full hd screen, because it's small with a lot of pixels.
#media screen and (min-resolution: 300dpi) {
//styling which will be applied >= 300dpi
}
Source 1
Source 2
Is there any way to fill video without stretching and cutting the video ?
1- MPMovieScalingModeFill - its stretching video.
2- MPMovieScalingModeAspectFill - its cutting video.
3- MPMovieScalingModeAspectFit - its shooing video in centre and showing black area.
No. Think about it! The MPMoviePlayerController's view is not the same aspect (ratio height to width) as the movie. So to make it fit, either you must cut some off (of either height or width), or you must letterbox it (black area) with one dimension being too small, or you must distort.
You should do the opposite: size the MPMoviePlayerController's view to fit the aspect of the movie!
I just got to test IE10 on a Surface Pro with 1920*1080 display resolution where "make text and other items larger or smaller" has been set to Large.
On my website I have added the CSS+JS viewport fix in addition to the viewport meta tag, all asking for width: device-width (plus I added a "min-width: 320px;" to the #-ms-viewport definition to ensure it never gets smaller than that).
I added some javascript to display the value of window.screen.width and $(window).width to see what the browser ended up using for viewport in IE10, and to my surprise the screen size of a 1920*1080 resolution display was reported as 1280x720!
Now, I can live with with that (just like small phone screens report 320px width no matter their actual resolution, since it is a good size to make stuff human readable across devices for the same font size), but when the 'Metro IE10' is snapped to the side of the screen, the problem comes: IE10 tries to make a 320px rendering of the website, but it zooms in so the right side of it is hidden.
I tried Microsofts own test page: http://ie.microsoft.com/testdrive/Graphics/MakeItSnappy/
It does the same thing - on the Surface Pro the right side is hidden, and you need to drag left/right to see it, and you cannot even zoom out to view the full width!
But when trying the same thing on my laptop with a 'normal' 1366x768 display (rendered as 100%), the snapped IE10 display has the perfect size.
Ok, I guess this is a Microsoft Windows scaling bug - but my question is: Has anybody else experimented with changing the "make text and other items larger or smaller" to 125% or 150% and making websites adapt correctly?
Check out this fix from developer Matt Stow
http://mattstow.com/responsive-design-in-ie10-on-windows-phone-8.html
In Expresson player when showing a video with 4:3 aspect ratio the full screen video image crops of some of the picture at the bottom, and inserts a black bar at the top. What part of the code should I change to fix this issue?
I had exactly the same problem, I have listed how to fix it with Expression Blend here:
http://social.expression.microsoft.com/Forums/en-US/encoder/thread/e58270bf-e101-4a13-ab8c-e7b3b7dbc2a9