JS實現網頁全屏與退出全屏
$('#alarm-fullscreen-toggler').on('click', function(e) { var element = document.documentElement; if (!$('body').hasClass("full-screen")) { $('body').addClass("full-screen"); $('#alarm-fullscreen-toggler').addClass("active"); if (element.requestFullscreen) { element.requestFullscreen(); } else if (element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if (element.webkitRequestFullscreen) { element.webkitRequestFullscreen(); } else if (element.msRequestFullscreen) { element.msRequestFullscreen(); } } else { $('body').removeClass("full-screen"); $('#alarm-fullscreen-toggler').removeClass("active"); if (document.exitFullscreen) { document.exitFullscreen(); } else if (document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if (document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } else if (document.msExitFullscreen) { document.msExitFullscreen(); } } });
全屏方法1:
var el = document.documentElement;
var rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;
if (typeof rfs != "undefined" && rfs) {
rfs.call(el);
} else if (typeof window.ActiveXObject != "undefined") {
var wscript = new ActiveXObject("WScript.Shell");
if (wscript != null) {
wscript.SendKeys("{F11}");
}
}
全屏方法2:
var docElm = document.documentElement;
//W3C
if (docElm.requestFullscreen) {
docElm.requestFullscreen();
}
//FireFox
else if (docElm.mozRequestFullScreen) {
docElm.mozRequestFullScreen();
}
//Chrome等
else if (docElm.webkitRequestFullScreen) {
docElm.webkitRequestFullScreen();
}
//IE11
else if (elem.msRequestFullscreen) {
elem.msRequestFullscreen();
}
退出全屏:
if (document.exitFullscreen) {
document.exitFullscreen();
}
else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
}
else if (document.webkitCancelFullScreen) {
document.webkitCancelFullScreen();
}
else if (document.msExitFullscreen) {
document.msExitFullscreen();
}
相關推薦
JS實現網頁全屏與退出全屏
$('#alarm-fullscreen-toggler').on('click', function(e) { var element = document.documentElement; if (!$('body').hasClass("full-screen")) { $('body'
div的全屏與退出全屏
.html ner class 方法 播放器 get ont show func div的全屏與退出全屏 作用:將div全屏與退出全屏,一般播放器使用較多。 html按鈕: <button onclick="showFull();">
手機影音第九天,控制視頻全屏播放與退出全屏播放,音量調節按鈕來控制視頻音量與靜音的實現
視頻的全屏播放 音量變化與靜音 代碼以托管到碼雲,有興趣的小夥伴可以下載看看 https://git.oschina.net/joy_yuan/MobilePlayer一、視頻全屏播放與退出全屏 系統默認的videoview類,沒有調整大小的方法,因此需要自定義一個類,繼承vide
QT中關於視窗全屏顯示與退出全屏的實現
QT中關於視窗全屏顯示與退出全屏的實現 近期在學習QT時遇到了很多問題這也是其中一個,個人通過在各種書籍和網路上的查閱找到了一些關於這方面的答案,希望能給大家一些幫助。 首先,在QT中對於視窗顯示常用的有這麼幾個方法可以呼叫: Qt全屏顯示函式 &nb
JS實現HTML中frameset瀏覽器全屏和退出全屏
<script type="text/javascript"> /* 全屏 */ function fullScreen() { var el = document.documentElement
js 控制網頁全屏及退出全屏
網上找了好多資料,基本大同小異,實際效果會出現IE不相容的現象(全屏和退出全屏都失效), 後來解決了,記錄如下:function requestFullScreen(element) { var
JS 控制網頁全屏或退出全屏
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w
JS實現全屏和退出全屏
直接上程式碼: //innerHTML指的是從物件的起始位置到終止位置的全部內容,包括Html標籤。//innerText 指的是從起始位置到終止位置的內容,但它去除Html標籤。 <script type="text/javascript"> function FullScreen(el)
JS實現瀏覽器全屏和退出全屏
測試環境: 【作業系統】: win7 64位 【IE】:IE9 【FireFox】: FireFox 29 【Chrome】: Chrome 34 眾所周知,IE是個奇葩的瀏覽器,但是由於使用者量很大,開發者還是不得不為IE考慮
js實現網頁全屏切換(平滑過渡),滑鼠滾動切換
實現效果為頁面平滑過渡全屏切換,點選導航和滑鼠滾動都可以切換。 效果圖: 程式碼: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8">
vue 實現全屏和退出全屏的功能
<span class="icon-contain" @click="getFullCreeen"> <svg-icon icon-class="quanping" /> </span> JS export default {
用js控制進入全屏,退出全屏
需求是這樣的 ,有一個圖示元素,點選後進入全屏,再次點選退出全屏。 實現程式碼: <li id="fullscreen"><a href="#" ><span cl
pdf.js使用和JS實現巢狀Iframe頁面F11全屏效果
1 Pdf.js使用 generic/web/viewer.html主要是渲染pdf閱讀器的樣式,而generic/web/viewer.js則是指定開啟的pdf檔案(當然還有其他功能,不過這些都不是我們關心的),我們看位於generic/web/viewer.j
Html+JS實現全選與非全選操作
看書:<input type="checkbox" name="checkbox" value=1><br> 寫字:<input type="checkbox" name="checkbox"value=2><br>
js 頁面全屏,退出全屏, fullScreen
專案有個需求,當點選開啟一個新頁面的時候需要該頁面全屏(類似F11鍵功能),查詢之後發現沒辦法直接用js來觸發全屏,只能通過使用者滑鼠、鍵盤等事件中才能觸發,即“對於一些非使用者事件,比如onload、
H5 video全屏與取消全屏相容
H5 video全屏與取消全屏各瀏覽器相容 // 全屏 // ele:全屏的物件 function requestFullscreen(ele) { // 全屏相容程式碼 if (ele.requestFullscreen) { ele.requestFullscre
利用js實現多行文字框的全選
<!DOCTYPE html> <html> <head> <title>139</title> <meta charset="utf-8"> <script type="t
Android 正確進入全屏和退出全屏的姿勢
進入全屏 private void hideSystemUI() { getWindow().getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN | View.SYSTEM_UI
js全選與取消全選
實現全選與取消全選的效果 要求1(將軍影響士兵):點選全選按鈕,下面的複選框全部選中,取消全選按鈕,下面的複選框全部取消 思路:複選框是否被選中,取決於check屬性,將全選按鈕的check屬性值賦值給下面所有複選框的check值 要求2(士兵影響將軍): 當下面的某個複選框沒有被選中時,全選按鈕自動變為沒被
使用js實現網頁驗證碼
btn post back html pan put mat control log 簡單易用,無需後臺程序。 HTML <div class="login-box-body"> <p class="login-bo