讓全屏API代碼跨瀏覽

-1

在我的網頁我有下面的代碼，我至極用於補充一些反對全屏一個讓全屏API代碼跨瀏覽

<script> 
    $(document).ready(function(){ 
    $('.fs-button').on('click', function(){ 
    var elem = document.getElementById('fullscreen'); 
    if (document.webkitFullscreenElement) { 
    document.webkitCancelFullScreen(); 
    } else { 
    elem.webkitRequestFullScreen(); 
    }; 
    }); 
    }); 
    </script>

問題是其僅適用於Chrome的工作。你能給我這個代碼的crossbrowser版本嗎？由於JS的知識欠佳，不能自己做。

來源

2017-01-20 Ted

您可以使用它。參考：https://msdn.microsoft.com/en-us/library/dn265028(v=vs.85).aspx

// Initiated by a user click on an element 
 

 
    function makeFullScreen(divObj) { 
 
     //Use the specification method before using prefixed versions 
 
     if (divObj.requestFullscreen) { 
 
     divObj.requestFullscreen(); 
 
     } 
 
     else if (divObj.msRequestFullscreen) { 
 
     divObj.msRequestFullscreen(); 
 
     } 
 
     else if (divObj.mozRequestFullScreen) { 
 
     divObj.mozRequestFullScreen(); 
 
     } 
 
     else if (divObj.webkitRequestFullscreen) { 
 
     divObj.webkitRequestFullscreen(); 
 
     } else { 
 
     console.log("Fullscreen API is not supported"); 
 
     } 
 

 
    }

一次編寫功能之後，你只需要點擊事件處理程序內調用的..

$(document).ready(function(){ 
 
    $('.fs-button').on('click', function(){ 
 
     var elem = document.getElementById('fullscreen'); 
 
     //call that function to make it fullscreen. 
 
     makeFullScreen(elem); 
 
    }); 
 
});

來源

2017-01-20 16:59:26

很抱歉，但我有不知道我應該在哪裏通過你的代碼，以及如何使它工作。我給出我的代碼片段的原因 - 因爲我已經找到了如何使它工作。通過點擊具有.fs-button類的按鈕，我們使#fullscreen id全屏顯示對象。我需要的只是添加到我的代碼中的其他行以使其適用於所有瀏覽器。是的，我完全不知道JS。 – Ted

結帳修改！ :) –

感謝您的幫助！ – Ted

讓全屏API代碼跨瀏覽

回答

相關問題