5 powerful HTML5 API function recommendations_html5 tutorial skills

// Find the full screen method suitable for the browser
function launchFullScreen(element) {
if(element.requestFullScreen) {
element.requestFullScreen();
} else if(element.mozRequestFullScreen) {
element.mozRequestFullScreen();
} else if(element.webkitRequestFullScreen) {
element.webkitRequestFullScreen();
}
}
// Launch full screen mode
launchFullScreen(document.documentElement); // the whole page
launchFullScreen(document.getElementById("videoElement")); // any individual element

// Set hidden attributes and visible change events The name and attributes need to be added with the browser prefix
// since some browsers only offer vendor-prefixed support
var hidden, state, visibilityChange;
if (typeof document.hidden !== "undefined") {
hidden = "hidden";
visibilityChange = "visibilitychange";
state = "visibilityState";
} else if (typeof document.mozHidden !== "undefined") {
hidden = "mozHidden";
visibilityChange = "mozvisibilitychange";
state = "mozVisibilityState";
} else if (typeof document.msHidden !== "undefined") {
hidden = "msHidden" ;
visibilityChange = "msvisibilitychange";
state = "msVisibilityState";
} else if (typeof document.webkitHidden !== "undefined") {
hidden = "webkitHidden";
visibilityChange = "webkitvisibilitychange";
state = "webkitVisibilityState";
}
// Add a listener for title change
document.addEventListener(visibilityChange, function(e) {
// Start or stop status processing
}, false);

// Set event listener
window.addEventListener("DOMContentLoaded", function() {
// Get element
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function(error) {
console.log("Video capture error: ", error .code);
};
// Set video listener
if(navigator.getUserMedia) { // Standard
navigator.getUserMedia(videoObj, function(stream) {
video. src = stream;
video.play();
}, errBack);
} else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
navigator.webkitGetUserMedia(videoObj, function(stream ){
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}
}, false);

var 배터리 = navigator.battery || navigator.mozBattery;
// 배터리 속성
console.warn("배터리 충전: ", 배터리 충전) // true
console.warn("배터리 수준: ", Battery.level); // 0.58
console.warn("배터리 방전 시간: ", Battery.dischargeTime)// 이벤트 리스너 추가
🎜>battery.addEventListener("chargechange", function(e) {
console.warn("배터리 충전 변경: ", 배터리.충전);
}, false);