A Pen by moritz jacobs

Thumbnail
This awesome code was written by moritzjacobs, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright moritzjacobs ©
  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  moritz jacobs</title>
  
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css">

  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <div class="webcam-video"><video autoplay id="video"></video></div>
  
  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/moritzjacobs/a-pen-by-moritz-jacobs-wjprQr */
#video {
  position: absolute;
  width: 100%;
  height: 100%;
  transition: opacity 500ms;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -o-object-fit: cover;
     object-fit: cover;
}
#video.blurred {
  opacity: 0.3;
}


/*Downloaded from https://www.codeseek.co/moritzjacobs/a-pen-by-moritz-jacobs-wjprQr */
navigator.mediaDevices.getUserMedia({
	audio: false,
	video: {
		width: {
			min: 1920,
			ideal: 3840,
			max: 3840
		},
		height: {
			min: 1080,
			ideal: 2160,
			max: 2160
		}
	}
}).then(function (stream) {
	video.srcObject = stream;
}).catch(function (err) {
	return console.log;
});

Comments