The web player of VOD uses a full screen scheme where device full screen is dominant and supplemented by webpage full screen. The priority of full screen mode is Fullscreen API > webkitEnterFullScreen > webpage full screen.
As Flash is gradually restricted by browsers, the VOD web player is developed in the HTML5 standard with reduced use of Flash. In some legacy browsers, the use of the full screen feature is restricted. The legacy VOD player 1.0 was developed by using Flash and achieved device full screen with the Flash plugin. For full screen mode in browsers that do not support the Fullscreen API, only the legacy VOD player 1.0 can be used.
Currently known full screen support is as follows:
To achieve in-page (non-full screen) playback, the playsinline
and webkit-playsinline
attributes need to be added to the video tag, which is done by Tencent Cloud Player by default. iOS 10+ recognizes the playsinline
attribute, while older iOS versions recognize the webkit-playsinline
attribute.
Tests show that in-page (inline) playback is supported in Safari on iOS. Android recognizes webkit-playsinline
, but such attributes may not take effect for there are many custom browsers due to the openness of Android. For example, the same-layer player attribute may need to be used to prevent the system from forcing playback in full screen mode in browsers with TBS kernel (including but not limited to WeChat, Mobile QQ, and QQ Browser). For more information, please see the Integration Documentation.
If the problem persists, please submit a ticket.
Set the WebView parameter allowsInlineMediaPlayback
to YES
to allow inline video playback, i.e., forbidding WebView/UiWebView to force full-screen video playback.
Set the allowfullscreen
attribute in the iframe
tag. Below is the sample code:
<iframe allowfullscreen src="" frameborder="0" scrolling="no" width="100%" height="270"></iframe>
In legacy browsers that do not support the Fullscreen API, the VOD player uses CSS to implement the webpage full screen mode. With the aid of full screen mode of the browsers (generally by pressing F11), the device full screen effect can be achieved. It should be ensured that the in-page full screen style of the player is not restricted by CSS in the page; for example, the parent container overflow:hidden
should not be set for the browser.
If iframe is used, the player cannot modify the CSS style outside the iframe, and the external page needs to provide script and style support. Generally, the external page requires cross-domain support to implement webpage full screen. Therefore, it is not recommended to use the player with iframe.
Note:Internet Explorer 8/9/10 do not support the Fullscreen API; therefore, the device full screen mode cannot be implemented through this API.
Was this page helpful?