ascii.js在浏览器中捕获摄像头视频流转ascii码流实时显示代码-html代码-BFW代码库

ascii.js在浏览器中捕获摄像头视频流转ascii码流实时显示代码

代码语言：html

所属分类：多媒体

代码描述：ascii.js在浏览器中捕获摄像头视频流转ascii码流实时显示代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html>

<head>

    <meta charset="utf-8" />
    <style>
        body {
    	padding: 50px;
    	background: white;
    	color: black;
    }
    
    h1 {
    	font-family: 'Helvetica neue', 'Helvetica', 'Arial', sans-serif;
    	font-size: 48px;
    	font-weight: 300;
    	color: #999;
    	text-align: center;
    }
    
    #notSupported {
    	display: none;
    }
    
    #notSupported h1 {
    	color: #b41a1a;
    	margin-bottom: 20px;
    }
    
    #notSupported img {
    	display: block;
    	margin: 0 auto;
    }
    
    #ascii {
    	font-family: 'Courier New', 'Courier', monospace;
    	font-size: 10px;
    	line-height: 10px;
    	letter-spacing: -1.5px;
    	text-align: center;
    }
    #button {
	display: none;
	margin: 20px auto;
	padding: 10px 20px;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 18px;
}
    </style>
</head>

<body>
    <h1 id="info">请允许使用你的摄像头.</h1>

    <div id="notSupported">
        <h1>Your browser does not support the Camera API.</h1>

    </div>

    <pre id="ascii"></pre>
    <button id="button">开始</button>

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/camera.1.1.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/ascii.js"></script>
    <scr.........完整代码请登录后点击上方下载按钮下载查看