Question

我在Iphone 6s和5s上遇到FullScreen模式的问题 - 它在Chrome和Safari中无法用于其他人我不知道。我没有任何苹果设备，所以我甚至不能自己复制它 - 我的一位客户报告了这一点。我已经在VMWare上安装了Mac OS Siera并用Safari测试了我的项目 - 一切都很好。现在我要安装XCode，但我的互联网很弱，所以这将是一个非常漫长的过程...... 要使用FullScreen，请使用以下内容：

/** @namespace */
const THREEx        = THREEx        || {};
THREEx.FullScreen   = THREEx.FullScreen || {};

export default THREEx.FullScreen;

/**
 * test if it is possible to have fullscreen
 *
 * @returns {Boolean} true if fullscreen API is available, false otherwise
*/
THREEx.FullScreen.available = function()
{
    return this._hasWebkitFullScreen || this._hasMozFullScreen;
}

/**
 * test if fullscreen is currently activated
 *
 * @returns {Boolean} true if fullscreen is currently activated, false otherwise
*/
THREEx.FullScreen.activated = function()
{
    if( this._hasWebkitFullScreen ){
        return document.webkitIsFullScreen;
    }else if( this._hasMozFullScreen ){
        return document.mozFullScreen;
    }else{
        console.assert(false);
    }
}


THREEx.FullScreen.addEventListener = function(element, handler) {
    if (element.addEventListener) {
        element.addEventListener('webkitfullscreenchange', handler, false);
        element.addEventListener('mozfullscreenchange', handler, false);
        element.addEventListener('fullscreenchange', handler, false);
        element.addEventListener('MSFullscreenChange', handler, false);
    }
}

THREEx.FullScreen.removeEventListener = function(element, handler) {
    if (element.removeEventListener) {
        element.removeEventListener('webkitfullscreenchange', handler, false);
        element.removeEventListener('mozfullscreenchange', handler, false);
        element.removeEventListener('fullscreenchange', handler, false);
        element.removeEventListener('MSFullscreenChange', handler, false);
    }
}


function exitHandler()
{
    if (document.webkitIsFullScreen || document.mozFullScreen || document.msFullscreenElement !== null)
    {
        /* Run code on exit */
    }
}

/**
 * Request fullscreen on a given element
 * @param {DomElement} element to make fullscreen. optional. default to document.body
*/
THREEx.FullScreen.request   = function(element)
{
    element = element   || document.body;
    if( this._hasWebkitFullScreen ){
        element.webkitRequestFullScreen();
    }else if( this._hasMozFullScreen ){
        element.mozRequestFullScreen();
    }else{
        console.assert(false);
    }
}

/**
 * Cancel fullscreen
*/
THREEx.FullScreen.cancel    = function()
{
    if( this._hasWebkitFullScreen ){
        document.webkitCancelFullScreen();
    }else if( this._hasMozFullScreen ){
        document.mozCancelFullScreen();
    }else{
        console.assert(false);
    }
}

THREEx.FullScreen._hasWebkitFullScreen  = 'webkitCancelFullScreen' in document  ? true : false;
THREEx.FullScreen._hasMozFullScreen = 'mozCancelFullScreen' in document ? true : false;

最令人困惑的是它与我的设备Huawei Honor 6（Android 4.4.2，Chrome和Firefox）以及Chrome开发工具仿真一起运行良好。那问题出在哪里？ iOS版？为什么它适用于Android Chrome，而不适用于iOS Chrome？

如果有人想看到所有项目或有iPhone并且可以测试它 - 转到http://3dflipbook.net，有jQuery或WordPress插件演示。我会很高兴看到任何细节。

提前致谢！

Answer 1

我似乎在我的问题上找到了答案：iOS Safari不支持FullScreen API http://caniuse.com/#feat=fullscreen。 iOS Chrome比Chrome浏览器本身http://www.mobilexweb.com/blog/chrome-ios-android-4-1-jelly-bean-html5更多是iOS Safari。

全屏不适用于Iphone 6s和5s

1 个答案: