2012-10-25 4 views
2

HTML5 캔버스를 사용할 때 다음을 사용하여 HTML5 비디오에서 캔버스를 설정할 수 있습니다.HTML5 이상의 컨테이너 (캔버스) 비디오

<video id ="video1" width="320" height="300" controls="controls" style="position:absolute; top: 10; left: 10;" > 

<canvas id="canvas3" width="320" height="240" style="position:absolute; top: 10; left: 10;" > 
</canvas> 

KineticJS를 사용하여 어떻게 동일한 작업을 수행 할 수 있습니까? KinetcJS를 사용하여 컨테이너 (캔버스)의 위치를 ​​설정하는 옵션이 표시되지 않습니다. Kinetic.StageKinetic.Node에서 setAbsolutePosition 빌려의 KineticJS 문서에서

var myStage = new Kinetic.Stage(canvas3, 100); 
     var stage = new Kinetic.Stage({ 
      container: "container", 
      width: 320, 
      height: 240 
     }); 

답변

1

:

나는 다음 있습니다. 이를 사용하여 노드의 x 및 y 위치를 설정할 수 있습니다.

Test demo. WebKit 콘솔을 사용하여 비디오 요소와 캔버스가 같은 위치에 있는지 확인하십시오.