最值得學(xué)習(xí)的是布局，canvas長(zhǎng)寬為450px，棋盤長(zhǎng)寬為435px恰當(dāng)?shù)亓舫?5px。使得click點(diǎn)擊的坐標(biāo)判斷范圍剛好等于以棋盤第i行j列為中心的30px正方形范圍
2017-04-24
//設(shè)置棋盤背景圖片
var logo=new Image();
logo.src="image/logo1.png";
logo.onload =function(){
context.drawImage(logo,0,0,450,450);
drawChessBoard();
}
var drawChessBoard=function(){
//通過for循環(huán)畫出棋盤間距14，共14條線，每格30像素
for(var i=0;i<15;i++){
//橫線
//縱線
}
var logo=new Image();
logo.src="image/logo1.png";
logo.onload =function(){
context.drawImage(logo,0,0,450,450);
drawChessBoard();
}
var drawChessBoard=function(){
//通過for循環(huán)畫出棋盤間距14，共14條線，每格30像素
for(var i=0;i<15;i++){
//橫線
//縱線
}
CanV.onclick=function(ev){
//獲取點(diǎn)擊位置
var x=Math.floor(ev.offsetX/30);
var y=Math.floor(ev.offsetY/30);
if(arrS.indexOf(x+"-"+y)===-1){
oneStep(x,y,me);
me =!me;
arrS.push(x+"-"+y);
}else{
CanV.style.disabled="disabled"
}
//獲取點(diǎn)擊位置
var x=Math.floor(ev.offsetX/30);
var y=Math.floor(ev.offsetY/30);
if(arrS.indexOf(x+"-"+y)===-1){
oneStep(x,y,me);
me =!me;
arrS.push(x+"-"+y);
}else{
CanV.style.disabled="disabled"
}
2017-03-27
最新回答 / 路人Bing
什么意思呢，是下子后再次點(diǎn)擊會(huì)有效果嗎？如果是這樣的話，可以在點(diǎn)擊事件里增加判斷。如果這個(gè)地方有子則可以用js再在子的邊緣加一圈陰影。
2017-03-13