キャンバス要素の位置を変更するにはどうすればよいですか？

CSSを使用せずにJavascriptでキャンバス要素のxとyの位置を変更できますか？私はインターネットでそれを聞いても誰も見つけられないようだ。キャンバス要素の位置を変更するにはどうすればよいですか？

編集：HTMLで行うことはできますか？

<html> 
<title>Testing</title> 
    <canvas id="main" width="200" height="200" style="border:1px solid  #c3c3c3;"> 
    Error: Browser does not support canvas element. 
    </canvas> 
    <script type="text/javascript">   
     var main = document.getElementById("main"); 
     var render = main.getContext("2d"); 
     main.width = 200; 
     main.height = 200; 
     main.style.left = 100x; 
     main.style.top = 100px; 
    </script> 
</html>

出典

2012-02-09 MrDrProfessorTyler

おそらく達成しようとしていることとその理由を説明します。それはより良い質の答えを可能にします。 – Jivings

Google Chromeのウィンドウでキャンバス要素の位置（x、y）を設定したいとします。これを行うために使用できるコードはありますか？ – MrDrProfessorTyler

CSSの左上と右端のプロパティを使用しないと意味しますか？ところで、なぜあなたはCSSを使いたくないのですか？ –

<html> 
<title>Testing</title> 
    <canvas id="main" width="200" height="200" style="border:1px solid  #c3c3c3;"> 
    Error: Browser does not support canvas element. 
    </canvas> 
    <script type="text/javascript"> 

     var main = document.getElementById("main"); 
     var render = main.getContext("2d"); 
     main.width = 200; 
     main.height = 200; 
     main.style.left = "100px"; 
     main.style.top = "100px"; 
     main.style.position = "absolute"; 
    </script> 
</html>

出典

2012-02-09 23:29:01

これを実装するコードを掲載しました。それは動作していないようです。 – MrDrProfessorTyler

キャンバスのpositionプロパティの値は何ですか？ canvas.style.position = 'absolute'を追加しますか？ –

私は上記のキャンバスを宣言しています。私はCSSを使用していません。上記のコードを見てください。 – MrDrProfessorTyler

CSSは、ページ上の位置要素は、他のものの間での特性を管理するために使用されます。 CSSファイルまたはインラインスタイルで上部または左のプロパティを定義しない場合は、Javascriptを使用してキャンバスをDOMにロードした後でも、これらのプロパティを設定できます。しかし、あなたがスクリプトでやっているのは、CSSがすでに管理しているのと同じプロパティを直接変更することだけです。

スタイルシートまたはインラインスタイルの代わりにプロパティを変更する場合、ページに既定のスタイルでコンテンツが既にロードされている場合を除いて、JSを動的に変更しない限り、技術的利点はありません。アニメーションを探している場合は、jQueryで、DOMアニメーション用の素晴らしいクロスブラウザソリューションをご覧ください。 JSを使用して一度の位置を設定するための基本コードのための回答が既に掲載されていますが、これはCSSにとって最も良い役割を担っていると言われています。

出典

2012-02-09 23:36:15

Javascriptでこれをどうやってやりますか？ – MrDrProfessorTyler

他の誰かが私をJSに殴ったように見えます。 –

キャンバス要素の位置を変更するにはどうすればよいですか？

答えて

関連する問題