電腦會(huì)自動(dòng)先繪制線條再繪制
圖片,所以一打開(kāi)就只能看到圖片而不能看到棋盤(pán)。
所以要把繪制棋盤(pán)的代碼封裝起來(lái),放在繪圖后面,則可以呈現(xiàn)出想要的畫(huà)面、結(jié)果
var logo = new Image();
logo.src ="images/1.png";
logo.onload =function(){
context.drawImage(loge,0,0,450,450);
}
var drawChessBoard = function() {
圖片,所以一打開(kāi)就只能看到圖片而不能看到棋盤(pán)。
所以要把繪制棋盤(pán)的代碼封裝起來(lái),放在繪圖后面,則可以呈現(xiàn)出想要的畫(huà)面、結(jié)果
var logo = new Image();
logo.src ="images/1.png";
logo.onload =function(){
context.drawImage(loge,0,0,450,450);
}
var drawChessBoard = function() {
2016-03-30
js畫(huà)棋盤(pán)
var chess = document.getElementById('chess');
var context = chess.getContext('2d');
context.strokeStyle = "#BFBFBF";
for(var i=0;i<15;i++){
context.moveTo(15+i*30,15);
context.lineTo(15+i*30,435);
context.stroke();
context.moveTo(15,15+i*30);
context.lineTo(435,15+i*30);
context.stroke();
}
var chess = document.getElementById('chess');
var context = chess.getContext('2d');
context.strokeStyle = "#BFBFBF";
for(var i=0;i<15;i++){
context.moveTo(15+i*30,15);
context.lineTo(15+i*30,435);
context.stroke();
context.moveTo(15,15+i*30);
context.lineTo(435,15+i*30);
context.stroke();
}
2016-03-30
最新回答 / ICHAYA
我剛開(kāi)始全部保存 后直接Open in Browser也沒(méi)有顯示保存好所有文件后關(guān)掉sublime,直接從文件夾打開(kāi)HTML文件就有顯示了(視頻里老師也是從文件夾打開(kāi)的)后續(xù)再次在sublime中Open in Browser 也會(huì)有顯示瀏覽器:chrome最新版
2016-03-30
style.css
canvas{
display:block;
margin: 50px auto;
box-shadow: -2px -2px 2px #BFBFBF,5px 5px 5px #B9B9B9;
}
canvas{
display:block;
margin: 50px auto;
box-shadow: -2px -2px 2px #BFBFBF,5px 5px 5px #B9B9B9;
}
2016-03-30