0

ビデオとその再生は正常に行われていますが、右下隅のビデオ タグにロゴを追加する必要があります (座標 (2,2,60,60) アイコンのサイズは 60*60 です)。キャンバスですが、このようなものが出てきました..

<html>
<head>
<title>testpage</title>
<script type="text/javascript">
window.addEventListener('load', function () {
var element = document.getElementById('myCanvas');
if (!element || !element.getContext) {
  return;
}

  var context = element.getContext('2d');
  if (!context || !context.drawImage) {
  return;
}

var google_img = new Image();
google_img.addEventListener('load', function () {
   context.drawImage(this, 2, 2, 60, 60);
},false);
google_img.src = "logo.png";

},false);
</script>
</head>
<body>
<div align="center" style="padding-top:25px;">
<video src="Simplevideo.mp4"  width="610" height="380" type="video/mp4" controls="controls"><p>Your browser does not support the video.</p></video> 
<canvas id="myCanvas" width="62" height="62">Your browser does not support HTML5 Canvas element.</canvas>
</div>
</body>
</html>

それを得るために任意の助け..

前もって感謝します

シェイマー・アリ・シェイク

4

1 に答える 1

0

loxxyがコメントで述べたように、単にdivを使用することもできますが、何らかの理由で本当にキャンバスを使用したい場合は、コードを含むjsfiddleを使用してください(修正済み):

http://jsfiddle.net/aS9VG/

秘訣は、要素を絶対位置に設定して、別の要素とオーバーラップできるようにすることです。

style="position:absolute;right:150px;bottom:300px"
于 2012-12-27T13:21:26.883 に答える