We are displaying the video using videoJS library in bootstrap modal, the video looks fine in modal popup. However, when we try to see the video in full screen mode the video look quite blur.
So, my is question do we need to set the resolution if going for full screen mode OR it is explicitly handled by VideoJS?
How can the video will be seen in correct resolution in full screen mode using videoJS library ?
I hope its a Progressive download via a HTTP server, check your network download speed/video quality, because if once video download starts the video-quality will be locked. its a common issue for progressive downloads.
Related
I'm trying to add embed youtube video in my Ionic project, just using iframe.
Once I added, it works on the normal web browser(Google Chrome).
However, if I changed view mode to device mode(F12 & Ctrl+Shift+M), and refresh browser, the embed video stopped auto-playing. Is there anyone have experience before fixed like this problem?
Here is the similar case with mine: http://jsfiddle.net/eFLqJ/1005/
This module will be helpful for your problem: https://github.com/orizens/ng2-youtube-player
I am trying to tell if my video is going to play inline once the user starts the video (as apposed to fullscreen/in the native video player) on an iPhone in a UIWebView before the video has started. I have no way of knowing if the UIWebView has the setting allowsInlineMediaPlayback = YES as i do not know in what app or on what page my video is being displayed.
My goal is to only show the video if it can be played inline.
Is there any way to read the allowsInlineMediaPlayback setting from javascript, or detect if my video will play inline or not?
Everything I have read on the apple developers website seems to suggest that it will automatically play in full screen mode in safari. Now if they are using another app, as far as I know you do not have access to that apps UIWebViews properties. However, in an attempt to not be totally useless, here is a link to all of the methods you can query and you might find some useful information in there.
https://developer.apple.com/library/safari/documentation/AudioVideo/Reference/HTMLMediaElementClassReference/HTMLMediaElement/HTMLMediaElement.html#//apple_ref/doc/uid/TP40009355-CH18-SW27
Some more information that may be useful to you.
https://developer.apple.com/library/safari/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html#//apple_ref/doc/uid/TP40009523-CH2-SW1
Recently I faced a problem with Youtube videos (iframe API) in WebView of Android 4.X devices.
The problem is onShowCustomView() not fired when video starts playing on Android 4.X devices. I searched for reason, why onShowCustomView() not fired? I got answer as in Android 4.X devices WebView has a feature Embedded Video, because of this video ( in HTML5) will be played by WebView and won't display the video in other Layout.
But when user requested Full Screen mode, then onShowCustomView() will be fired.
Actually I need the Full screen mode of youtube video by default, In Youtube's iframe API no such option to enter full screen, user has to press full screen button.
So for my requirement only 2 answers are there.
Disbaling of Embedded Video for my WebView, then it will work like below Android 4.X and onShowCustomView() will be fired.
Setting the full screen mode by default with Javascript in html file supplying to WebView.
So If anybody got solution to my problem please help me otherwise suggest me to solve this.
I've taken a look at the YouTube API and it seems quite clear (for security reasons) that the player (embedded or not) does not allow YouTube video to automatically initiate full screen once loaded.
I wondered if there was a way to do this using Javascript to act as if the user had pressed the full screen button?
Any ideas shared would be greatly appreciated.
I'm afraid you can't use the YouTube player API to initiate fullscreen programatically.
This is because the underlying issues with fullscreen in flash and html5 video would make such an api method seriously error-prone.
Official response to back me up:
https://groups.google.com/forum/#!msg/youtube-api-gdata/Tyv3vTw0RQk/449KahYVNFYJ
I'm looking to add some videos to my mobile webapp. For the best UX, I'd like to avoid having a simple static video-tag. (because its in an element which is webkit animated and video + webkit animations don't always play nicely together in my experience.)
Rather, I'd like to have an image (with a play icon on it) to "link" to the video. Mobile YouTube (as seen on iOS) have done this very nicely where when you click the image, the video seems to "pop" up to fullscreen and plays. How do they do this? Is it a link? A previously hidden video-tag? Some webkit-animation to do the "popping"?
I snooped around using Chrome Inspector (+user agent switcher to iphone4) but the videos don't play on the desktop browser, and the code overall looks quite complex..
Can you help?
What you can do is on-click of the video thumbnail, you can load the video url using the object/embed tags. In IOS, whenever a video starts playing it automatically plays it in fullscreen(feature of IOS itself)
I believe you can do something similar to this on certain browsers (e.g. WebKit.)