|
| <!DOCTYPE html> |
|
<style> |
|
*, |
|
*:before, |
|
*:after { |
|
font-family: Verdana, Arial, sans-serif; |
|
font-size: 12px; |
|
box-sizing: inherit; |
|
} |
|
#start_button { |
|
border: 0; |
|
/*background-color:transparent;*/ |
|
padding: 0; |
|
} |
|
.mic-button { |
|
float: right; |
|
width: 48px; |
|
height: 48px; |
|
} |
|
.header-unit parent iframe { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
bottom: 0; |
|
text-align: center; |
|
width: 100%; |
|
height: 100%; |
|
border: 0; |
|
} |
|
#parent { |
|
height:100%; |
|
width:100%; |
|
position: relative; |
|
overflow: hidden; |
|
} |
|
iframe { |
|
width: 100%; |
|
height: 100%; |
|
position: absolute; |
|
z-index: 0; |
|
} |
|
#yt_iframe { |
|
/*border: 0;*/ |
|
/*background-color:transparent;*/ |
|
position: absolute; |
|
z-index: 1; |
|
} |
|
</style> |
|
<html lang="en"> |
|
<head> |
|
<meta charset="utf-8"> |
|
<meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
|
<title>Live Audio/Video Translate</title> |
|
<label style="font-size: 12px">Youtube URL :</label> <input id="url_box" type="url"></input> |
|
<button type="button" id="embed_button">Embed</button> |
|
|
|
<label style="font-size: 12px">Audio Language :</label> |
|
<select id="select_src_language" style="font-size:12px"></select> |
|
<select id="select_src_dialect" style="font-size:12px"></select> |
|
|
|
<label style="font-size: 12px">Translation :</label> |
|
<select id="select_dst_language" style="font-size:12px"></select> |
|
<select id="select_dst_dialect" style="font-size:12px"></select> |
|
<div class="mic-button"> |
|
<button id="start_button"> |
|
<img id="start_img" src="images/mic.gif" alt="Start" height="45%" width="45%" border="0"> |
|
</button> |
|
</div> |
|
<br></br> |
|
&n bsp; &nbs p; |
|
&n bsp; &nbs p; |
|
&n bsp; &nbs p; |
|
&n bsp; |
|
<input type="checkbox" id="checkbox_show_src" name="checkbox_show_src"> <label style='font-size: 12px'> Show recognized audio text </label> |
|
&n bsp; |
|
<input type="checkbox" id="checkbox_show_dst" name="#checkbox_show_dst"> <label style='font-size: 12px'> Show translation text</label> |
|
</head> |
|
|
|
<body> |
|
<div class="header-unit"> |
|
<div class="parent"> |
|
<div class="yt_iframe"> |
|
<iframe id="yt_iframe" width="960" height="540" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen class="fillWidth"></iframe> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<!--script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> |
|
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/themes/smoothness/jquery-ui.css" /> |
|
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js"></script--> |
|
<script src="js/jquery.min.js"></script> |
|
<link rel="stylesheet" href="css/jquery-ui.css"> |
|
<script src="js/jquery-ui.min.js"></script> |
|
<!--link rel="stylesheet" href="https://unpkg.com/video.js/dist/video-js.css" > |
|
<script src="https://unpkg.com/video.js/dist/video.js"></script> |
|
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script--> |
|
<script type='text/javascript' src="js/index.js"></script> |
|
</body> |
|
</html> |
|
Citar
problema con el microfono en la web local
Iniciado por gasol
Permisos de publicación