                        課程
                    
                        /前端開發(fā)
                        
                            /HTML/CSS
                        
                        /HTML5小游戲---愛心魚（上）

我的背景沒出來，哪位大神幫我看看？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

body{

padding-top:10px;

}

.main{

width:800px;

height:600px;

margin:0 auto;

}

#allcanvas{

width:800px;

height:600px;

margin:0 auto;

position:relative;

}

#canvas1{

position:absolute;

bottom:0;

left:0;

z-index:1;

}

#canvas2{

position:absolute;

bottom:0;

left:0;

z-index:1;

}

</style>

</head>

<body>

? ? ? <div id="allcanvas">

? ? ? ? ? ?<div id="canvas1" height='600' width='800'></div>

? ? ? ? ? ?<div id="canvas2" height='600' width='800'></div>

? ? ? </div>

</div>

</body>

</html>

// JavaScript Document

var can1;

var can2;

var ctx1;

var ctx2;

var lastTime;

var deltaTime;

var canWidth;

var canHeight;

var bgPic=new Image();

document.body.onload=game;

function game(){

init();

lastTime=Date.now();

deltaTime=0;

gameloop();

}

function init(){

//獲得canvas context

can1=document.getElementById('canvas1');//fish dust UI circle

ctx1=can1.getContext('2d');

can2=document.getElementById('canvas2');//background one fruits

ctx2=can2.getContext('2d');

bgPic.src="./src/background.jpg";

canWidth=can1.width;

canHeight=can2.height;

}

function gameloop(){

window.requestAnimFrame(gameloop);//循環(huán)

var now=Date.now();

deltaTime=now-lastTime;

lastTime=now;

}

// JavaScript Document

function drawBackground(){

ctx2.drawImage(bgPic,0,0,canWidth,canHeight);

}

xiao55555

2015-12-11

源自：HTML5小游戲---愛心魚（上） 2-1

關(guān)注問題我要回答

2069

操作

收起

9 回答

慕粉13261604892
2016-11-30

應(yīng)該是canvas 不是div

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

且聽風(fēng)吟cy
2016-08-02

window.requestAnimFrame(gameloop); ? ? 這里也寫錯(cuò)了、

應(yīng)該是window.requestAnimationFrame(gameloop);

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

慕仙837676

那commonFunctions.js文檔里的window.requestAnimFrame需要改嗎？

2018-12-28 回復(fù) 有任何疑惑可以回復(fù)我~

姑娘有點(diǎn)太傲嬌
2016-01-08

你的問題解決了嗎？我出現(xiàn)了和你一樣的問題你是怎么解決的

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

慕無忌5517827
2015-12-31

我們是一樣的問題，但是，我去js文件下看到我的background.js根本就是0KB，所以，你看一下你的會(huì)不會(huì)是在編輯器下沒有保存你的background.js，我的是這個(gè)問題，保存了背景就出來了

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

xiaxiaaichixia

怎么保存的》？

2016-11-24 回復(fù) 有任何疑惑可以回復(fù)我~

尤快快
2015-12-17

var can1;

var can2;

var ctx1;

var ctx2;

var canWidth;

var canHeight;

var lastTime;

var deltaTime;

var bgPic=new Image();

document.body.onload=game;

function game () {

init();

lastTime=Date.now();

deltaTime=0;

gameloop();

}

function init () {

can1=document.getElementById("canvas1");

ctx1=can1.getContext("2d");

can2=document.getElementById("canvas2");

ctx2=can2.getContext("2d");

canWidth=can1.width;

canHeight=can1.height;

bgPic.src="./src/background.jpg";

}

function gameloop () {

requestAnimationFrame(gameloop);//setInterval setTimeout

var now=Date.now(0);

deltaTime=now-lastTime;

lastTime=now;

drawBackground();

}

就是加下劃線的地方報(bào)錯(cuò) 好煩

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

xiao55555 提問者

很抱歉，我也不知道哪里錯(cuò)了，你是加我為好友了嗎?我不知道它這個(gè)能不能發(fā)起對(duì)話，我沒找到

2015-12-17 回復(fù) 有任何疑惑可以回復(fù)我~

尤快快回復(fù) xiao55555 提問者

我找到這個(gè)錯(cuò)誤了但是又發(fā)現(xiàn)別的錯(cuò)了

2015-12-17 回復(fù) 有任何疑惑可以回復(fù)我~

xiao55555 提問者回復(fù) 尤快快

這是什么錯(cuò)誤？

2015-12-17 回復(fù) 有任何疑惑可以回復(fù)我~

查看1條回復(fù)

尤快快
2015-12-16

這里老是報(bào)錯(cuò)can1.getContext is not a function 不知道為什么求幫助

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

xiao55555 提問者

我還以為是回復(fù)我的，沒想到是提問的，你用的什么工具？

2015-12-16 回復(fù) 有任何疑惑可以回復(fù)我~

尤快快回復(fù) xiao55555 提問者

sublime Text2 呀能解決么

2015-12-17 回復(fù) 有任何疑惑可以回復(fù)我~

慕婉清0837092

我也是，總說不是一個(gè)function

2016-06-20 回復(fù) 有任何疑惑可以回復(fù)我~

查看1條回復(fù)

echo_kinchao
2015-12-14

最好寫成相對(duì)路徑

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

xiao55555 提問者
2015-12-11

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

body{

padding-top:10px;

}

.main{

width:800px;

height:600px;

margin:0 auto;

}

#allcanvas{

width:800px;

height:600px;

margin:0 auto;

position:relative;

}

#canvas1{

position:absolute;

bottom:0;

left:0;

z-index:1;

}

#canvas2{

position:absolute;

bottom:0;

left:0;

z-index:1;

}

</style>

</head>

<body>

? ? ? <div id="allcanvas">

? ? ? ? ? ?<div id="canvas1" height='600' width='800'></div>

? ? ? ? ? ?<div id="canvas2" height='600' width='800'></div>

? ? ? </div>

</div>

</body>

</html>

// JavaScript Document

var can1;

var can2;

var ctx1;

var ctx2;

var lastTime;

var deltaTime;

var canWidth;

var canHeight;

var bgPic=new Image();

document.body.onload=game;

function game(){

init();

lastTime=Date.now();

deltaTime=0;

gameloop();

}

function init(){

//獲得canvas context

can1=document.getElementById('canvas1');//fish dust UI circle

ctx1=can1.getContext('2d');

can2=document.getElementById('canvas2');//background one fruits

ctx2=can2.getContext('2d');

bgPic.src="./src/background.jpg";

canWidth=can1.width;

canHeight=can2.height;

}

function gameloop(){

window.requestAnimFrame(gameloop);//循環(huán)

var now=Date.now();

deltaTime=now-lastTime;

lastTime=now;

drawBackground();

}

// JavaScript Document

function drawBackground(){

ctx2.drawImage(bgPic,0,0,canWidth,canHeight);

}

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

李曉健
2015-12-11

沒看到你調(diào)用?drawBackground 這個(gè)畫背景的方法呀

0 回復(fù) 有任何疑惑可以回復(fù)我~

收起回答

xiao55555 提問者

我又加上了，但還是沒有效果

2015-12-11 回復(fù) 有任何疑惑可以回復(fù)我~

李曉健回復(fù) xiao55555 提問者

那就再看一下你的圖片路徑是不是對(duì)的了

2015-12-11 回復(fù) 有任何疑惑可以回復(fù)我~

xiao55555 提問者回復(fù) 李曉健

我查了一下，改了src/background.jpg,還是不行

2015-12-11 回復(fù) 有任何疑惑可以回復(fù)我~

查看1條回復(fù)

舉報(bào)

0/150

提交

取消

HTML5小游戲---愛心魚（上）

參與學(xué)習(xí) 92343 人
解答問題 583 個(gè)

學(xué)做HTML5游戲，輕輕松松帶你上手，適合剛?cè)胧钟螒蜷_發(fā)的同學(xué)

進(jìn)入課程

本課相似問答

2 回答沒有報(bào)錯(cuò)，可是背景圖片沒有出來，哪位大神幫我看看謝謝了：（

5 回答圖片加載不出來哪位大神幫我看看

1 回答奇怪，大神幫我看看什么情況

3 回答背景出不來

2 回答背景不顯示..求助大神

搜索更多本課相關(guān)問答

我的背景沒出來，哪位大神幫我看看？

我要回答關(guān)注問題

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

我的背景沒出來，哪位大神幫我看看？

9 回答

本課相似問答

我的背景沒出來，哪位大神幫我看看？

我的背景沒出來，哪位大神幫我看看？

我的背景沒出來，哪位大神幫我看看？