摘要:這段時間在管理后臺,有用到圖片全屏的,我是用的引入的圖片,哎也是給自己挖了一個大坑,沒辦法,只能踩坑走啦,所以當時想著能不能直接用直接進行圖片全屏查看,不過網上百度出來的也是五花八門,結合百度自己整理了一個小的點擊全屏引入圖片在中進行全屏并
這段時間在管理后臺,有用到圖片全屏的,我是用canvas的引入的圖片,哎!也是給自己挖了一個大坑,沒辦法,只能踩坑走啦,所以當時想著能不能直接用canvas直接進行圖片全屏查看,不過網上百度出來的也是五花八門,結合百度自己整理了一個小的demo
HTMLJS
window.onload = function(){ //引入圖片在canvas中 var blog =document.getElementById("blog"); var context = blog.getContext("2d"); var img = new Image(); img.onload = function(){ draw(this); }; img.src = "img/2.jpg"; function draw(obj){ context.drawImage(obj,0,0); } }; //進行全屏并適配各瀏覽器 function fullScreen() { var element = document.getElementById("blog"),method = "RequestFullScreen"; var prefixMethod; ["webkit", "moz", "ms", "o", ""].forEach(function(prefix) { if (prefixMethod) return; if (prefix === "") { // 無前綴,方法首字母小寫 method = method.slice(0,1).toLowerCase() + method.slice(1); } var fsMethod = typeof element[prefix + method]; if (fsMethod + "" !== "undefined") { // 如果是函數,則執行該函數 if (fsMethod === "function") { prefixMethod = element[prefix + method](); } else { prefixMethod = element[prefix + method]; } } } ); return prefixMethod; };
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/116415.html
摘要:這段時間在管理后臺,有用到圖片全屏的,我是用的引入的圖片,哎也是給自己挖了一個大坑,沒辦法,只能踩坑走啦,所以當時想著能不能直接用直接進行圖片全屏查看,不過網上百度出來的也是五花八門,結合百度自己整理了一個小的點擊全屏引入圖片在中進行全屏并 這段時間在管理后臺,有用到圖片全屏的,我是用canvas的引入的圖片,哎!也是給自己挖了一個大坑,沒辦法,只能踩坑走啦,所以當時想著能不能直接用c...
摘要:推薦這么做,因為如果每個都要這樣重復的判斷瀏覽器前綴,那也太惡心了瀏覽器是否支持全屏模式屬性返回一個布爾值,表示當前文檔是否可以切換到全屏狀態。 showImg(https://segmentfault.com/img/remote/1460000017229080?w=700&h=467); 我第一次對網頁全屏模式有概念,是那種網頁播放視頻的全屏播 放的那種。感覺很強,前幾個星期有個...
閱讀 1701·2021-11-25 09:43
閱讀 2665·2019-08-30 15:53
閱讀 1808·2019-08-30 15:52
閱讀 2897·2019-08-29 13:56
閱讀 3316·2019-08-26 12:12
閱讀 565·2019-08-23 17:58
閱讀 2126·2019-08-23 16:59
閱讀 931·2019-08-23 16:21