사용자 도구

사이트 도구


playground:playground

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

양쪽 이전 판이전 판
양쪽 다음 판
playground:playground [2022/08/16 19:19]
hyubiorobotics 제거됨
— (현재)
줄 1: 줄 1:
-<!DOCTYPE html> 
-<html> 
-<head> 
- <meta name="viewport" content="width=320, initial-scale=1"/> 
- <title>jsmpeg-vnc</title> 
- <style type="text/css"> 
- body { 
- background: #111; 
- text-align: center; 
- margin: 0; 
- padding: 0; 
- font-family: sans-serif; 
- color: #555; 
- } 
- body.desktop .mobile-only { display: none; } 
- body.mobile .desktop-only { display: none; } 
- 
- #videoCanvas { 
- /* Always stretch the canvas to 100%, regardless of its 
- internal size. */ 
- width: 100%; 
- height: 100%; 
- } 
-  
- .keys { 
- position: relative; 
- } 
- .key { 
- color: #fff; 
- float: left; 
- width: 72px; 
- height: 48px; 
- padding-top: 24px; 
- background-color: #5bcbeb; 
- position: absolute; 
- } 
- .key-small { 
- height: 28px; 
- padding-top: 8px; 
- } 
- #key-up {left: 40px; top: 0px; } 
- #key-down {left: 40px; top: 88px; } 
- #key-left {left: 160px; top: 0px; } 
- #key-right {left: 240px; top: 0px; } 
- #key-esc {left: 160px; top: 124px; } 
- #key-enter {left: 240px; top: 124px; } 
- </style> 
-</head> 
-<body> 
- <canvas id="videoCanvas" width="640" height="480"></canvas> 
- 
- <div class="keys mobile-only"> 
- <div class="key" data-code="38" id="key-up">UP</div> 
- <div class="key" data-code="40" id="key-down">DOWN</div> 
- <div class="key" data-code="39" id="key-right">RIGHT</div> 
- <div class="key" data-code="37" id="key-left">LEFT</div> 
-  
- <div class="key key-small" data-code="27" id="key-esc">ESC</div> 
- <div class="key key-small" data-code="13" id="key-enter">ENTER</div> 
- </div> 
- 
- <script type="text/javascript" src="jsmpg.js"></script> 
- <script type="text/javascript" src="jsmpg-vnc.js"></script> 
-</body> 
-</html>