You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
1.9 KiB
78 lines
1.9 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Vedio</title>
|
|
<style>
|
|
body{
|
|
background-color:#98b7c4;
|
|
}
|
|
|
|
video{
|
|
width: 70%;
|
|
height: 50%;
|
|
margin: 50px auto;
|
|
background-color: aquamarine;
|
|
display: block;
|
|
}
|
|
h3{
|
|
margin-left:50px auto;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div>
|
|
<h3><label id="time" style="color: #000; "></label></h3>
|
|
<video id="video"></video>
|
|
</div>
|
|
|
|
<script>
|
|
var video = document.getElementById('video');
|
|
|
|
|
|
if (navigator.mediaDevices.getUserMedia) {
|
|
//最新的标准API
|
|
navigator.mediaDevices.getUserMedia({video : {width: 1000, height: 1000}}).then(success).catch(error);
|
|
} else if (navigator.webkitGetUserMedia) {
|
|
//webkit核心浏览器
|
|
navigator.webkitGetUserMedia({video : {width: 1000, height: 1000}},success, error)
|
|
} else if (navigator.mozGetUserMedia) {
|
|
//firfox浏览器
|
|
navigator.mozGetUserMedia({video : {width: 1000, height: 1000}}, success, error);
|
|
} else if (navigator.getUserMedia) {
|
|
//旧版API
|
|
navigator.getUserMedia({video : {width: 1000, height: 1000}}, success, error);
|
|
}
|
|
function success(stream) {
|
|
//兼容webkit核心浏览器
|
|
// let CompatibleURL = window.URL || window.webkitURL;
|
|
|
|
//将视频流设置为video元素的源
|
|
console.log(stream);
|
|
|
|
//video.src = CompatibleURL.createObjectURL(stream);
|
|
video.srcObject = stream;
|
|
video.play();
|
|
}
|
|
|
|
function error(error) {
|
|
console.log(`访问用户媒体设备失败${error.name}, ${error.message}`);
|
|
}
|
|
function mytime(){
|
|
|
|
var a = new Date();
|
|
|
|
var b = a.toLocaleTimeString();
|
|
|
|
var c = a.toLocaleDateString();
|
|
|
|
document.getElementById("time").innerHTML = c+" "+b;
|
|
|
|
}
|
|
|
|
setInterval(function() {mytime()},1000);
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html> |