html5教學畫矩形程式碼分享_html5教學技巧

複製代碼

代碼如下:

🎜>

">http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"> a>>

<script><br />$(document).ready(function(){<br />var c=document.getElementById("drawbox");<br />var draw =c.getContext("2d"); //取得2d內容的引用，呼叫繪圖API<br />draw.fillStyle="#ff0000"; //方式一指定填滿色<br />draw.fillRect(0,0,300,100 ); //座標和長寬<br />draw.fillStyle="rgba(0,0,255,0.5)"; //方式二rgb 透明度<br />draw.fillRect(400,0,100,100); //座標和長寬<br />})<br /></script>