ホームページ  >  記事  >  ウェブフロントエンド  >  JS線画(サンプルコード)_JavaScriptスキル

JS線画(サンプルコード)_JavaScriptスキル

WBOY
WBOYオリジナル
2016-05-16 17:13:551251ブラウズ

IE下画線

复制代码代码如下:








from='200,200'
to='300,100'
style='位置:絶対;z-インデックス:8'> 
 

<script><br>var R =function(){};<br>R.prototype.createLine = function (startX,startY,endX,endY){ <br> var le = document.createElement( " <v:line><v:line>" );  <br> le.from = startX ',' startY ;  <br> le.to = endX ',' endY ;  <br> le.ストロークカラー= "赤" ;  <br> le.ストロークウェイト= "1pt" ;  <br> ファイルを返します。  <br>} <br>var d =new R();<br>document.body.appendChild(d.createLine(1,1,200,100));<br></script>


FF下画線
复制代码代码如下:

< ;html>

キャンバスの fillRect、strokeRect、clearRect の例


<スクリプト タイプ="text/javascript">
functiondrawShape(){
// DOM を使用してキャンバス要素を取得します
var Canvas = document.getElementById('tutorial');

// キャンバスがサポートされていない場合は実行しないようにします

if (canvas.getContext){

// getContext を使用してキャンバスを描画に使用します
var ctx = Canvas.getContext('2d');

// 図形を描画します
ctx.fillRect(25,25,100,100);
ctx.clearRect(45,45,60,60);
ctx.ストロークRect(50,50,50,50) ;

ctx.beginPath();
ctx.moveTo(100,100);
ctx.lineTo(200,250);
ctx.lineTo(50,250);
ctx.closePath();
ctx.ストローク();

} else {
alert('このデモを表示するには、Safari または Firefox 1.5 が必要です。');
}
}







声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。