¤Ï¤¸¤á¤Ë
¤³¤³¤Ç¤Ï¥×¥í¥°¥é¥à¤Î³Ø½¬¤ò¤·¤Þ¤¹
º£¤Ï¤ä¤ê¤Î£È£Ô£Í£Ì£µ¤Ç¥²¡¼¥à¤òºî¤ë²ÝÄø¤òÊÙ¶¯¤·¤Þ¤¹
ºî¤ë¥²¡¼¥à¤Ï¿À·Ð¿ê¼å¤Ç¤¹
¥³¥ó¥Ô¥å¡¼¥¿¸À¸ìÆþÌç¡¡£×£Å£Â¡¡£È£Ô£Í£Ì£µ¤Î³Ø½¬-2
canvas¤Ë²èÁü£Ç£É£Æ¤òÆɤ߹þ¤ßɽ¼¨¤¹¤ë¡£
card¡Ê²èÁü¤¬Æþ¤Ã¤Æ¤¤¤ë¡Ë¥Õ¥©¥ë¥À¡¼¤È¤³¤ÎHTML¤òƱ¤¸¾ì½ê¤ËÃÖ¤¯
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="UTF-8"> | |
<title>canvas¤Ç¿Þ·Á¤òÉÁ¤¯</title> | |
<script type="text/javascript"> | |
<!-- | |
//Image¥ª¥Ö¥¸¥§¥¯¥È¤òÀ¸À®¤·¤Æ¡¢²èÁü¥Õ¥¡¥¤¥ë¤òÀèÆɤߤ·¤Æ¤ª¤¯ | |
cardimg= new Array(16); | |
cardimg[1] = new Image(); | |
cardimg[2] = new Image(); | |
cardimg[3] = new Image(); | |
cardimg[4] = new Image(); | |
cardimg[5] = new Image(); | |
cardimg[6] = new Image(); | |
cardimg[7] = new Image(); | |
cardimg[8] = new Image(); | |
cardimg[9] = new Image(); | |
cardimg[10] = new Image(); | |
cardimg[11] = new Image(); | |
cardimg[12] = new Image(); | |
cardimg[13] = new Image(); | |
cardimg[14] = new Image(); | |
cardimg[1].src = "./card/1_he.gif"; | |
cardimg[2].src = "./card/2_he.gif"; | |
cardimg[3].src = "./card/3_he.gif"; | |
cardimg[14].src = "./card/0_r2.gif"; | |
var x; | |
function disp() { | |
//ÉÁ²è¥³¥ó¥Æ¥¥¹¥È¤Î¼èÆÀ | |
var canvas = document.getElementById('hart'); | |
if (canvas.getContext) { | |
var context = canvas.getContext('2d'); | |
//ºÂɸ(10, 10)¤Î°ÌÃ֤˥¤¥á¡¼¥¸¤òɽ¼¨ | |
for (x=1;x<4;x++){ | |
context.drawImage(cardimg[x], 10+80*x-80, 10); | |
} | |
} | |
} | |
function initgame() { | |
} | |
//--> | |
</script> | |
</head> | |
<body onLoad="disp()"> | |
<h2>Canvas¤Ç¿Þ·Á¤òÉÁ¤¯</h2> | |
<canvas width="300" height="150" id="hart" style="background-color:green;"> | |
¿Þ·Á¤òɽ¼¨¤¹¤ë¤Ë¤Ï¡¢canvas¥¿¥°¤ò¥µ¥Ý¡¼¥È¤·¤¿¥Ö¥é¥¦¥¶¤¬É¬ÍפǤ¹¡£ | |
</canvas> | |
</body> | |
</html> | |
£÷£é£î£ä£ï£÷£ó¡¡ÍÑ¤Î¥×¥í¥°¥é¥à¤Î³Ø½¬
£é£ð£è£ï£î£å¡¡£é£ð£á£ä¡¡£á£î£ä£ï£ò£ï£é£äÍѤγؽ¬