128kj
- 浏览: 600549 次
- 来自: ...
-
最新评论
-
lgh1992314：
相同的元素呢
一种离散化方法 -
HelloSummerR：
圆心的位置是随机的，于是圆的部分会落到canvas外，那样就显 ...
HTML5 Canvas学习笔记(1)处理鼠标事件 -
hlstudio：
好久没见到sokuban了，这有个java版的，带源码，可以参 ...
求推箱子的最小步数（java) -
肖泽文：
太好了，谢谢你。。有中文注释！
HTML5 推箱子游戏过关演示动画 -
swm8023：
删除操作，将最后一个叶子节点插入后也有可能上浮吧
彻底弄懂最大堆的四种操作(图解+程序)（JAVA）
文章列表
欢迎访问博主的网站：http://www.108js.com
查看效果：http://www.108js.com/article/article3/game/ex1/exam.html
效果图：
一、HTML代码：
<!DOCTYPE html>
<html lang='zh'>
<head>
<meta charset='gbk' />
<title>HTML5 Canvas 简单淡入淡出__www.108js.com</title>
<script src='introState.js'& ...
点击这里可以查看动画效果：
http://www.108js.com/article/article3/zip1/BezierAnim.html
欢迎访问博主的网站：http://www.108js.com
效果图：
代码：
<html>
<head>
<meta charset="gbk">
<title>贝塞尔曲线动画</title>
</head>
<body>
<canvas id = "myCanvas" width=&qu ...
当执行冗长的for语句时，要保持语句块的尽量简洁，例如：
糟糕！！
for(var i = 0; i < someArray.length; i++) {
var container = document.getElementById('container');
container.innerHtml += 'my number: ' + i;
console.log(i);
}
这样每次循环都要计算数组的长度，并且每次都要遍历dom查询“container”元素——效率严重地下！
建议！！
var container = document.getE ...
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="myCanvas" width="578" height="200"></canvas>
<script&g ...
创建HTML5的画布动画，我们可以使用requestAnimFrame()方法使浏览器以确定最佳的FPS为我们更新动画。对于每一个动画帧，我们可以更新在画布上的元素，清除画布，重新绘制的画布，然后请求另一个动画帧。
下面是一个简单的框架，备用。
<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
&l ...
点击这里可以看到动画效果：
http://www.108js.com/article/article7/src/70206/Arcs1.html
欢迎访问博主的网站：http://www.108js.com
效果图：
代码：
<!DOCTYPE html>
<html><head><meta charset="gbk">
<title>HTML5 Canvas画圆</title>
</head>
<body>
<canvas id="canvas&qu ...
效果图：
笛卡尔公式:r = a(1-sin弧度)画“红心”。
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="gbk">
<title>HTML5 Canvas“红心一棵”</title>
</head>
<body>
<canvas id="canvas&q ...
点击这里看效果：
http://www.108js.com/article/article7/src/seal/seal.html
效果图：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="gbk">
<title>HTML5 Canvas画印章</title>
</head>
<body>
<canvas id="ca ...
题目（poj1475)：推箱子，要求箱子移动步骤最小。如图：T为目标地，B为箱子，S为推箱子的人，要求将B推到T，步骤最少。
[输入输出]:
[解题分析]:
题解：双重bfs，先对箱子bfs，然后判断这种bfs是否可达（对人bfs）
下面是AC过的代码：
import java.util.*;
import java.io.*;
public class Main{
int r;//地图行数
int c;//地图列数
int begx, begy;//箱子开始坐标
int endx, endy;//目标坐标
int begsx, begsy;/ ...
点这里可以看动画效果:
http://www.108js.com/article/article3/zip1/text.html
效果图：
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="gbk">
<title>旋转文本</title>
</head>
<body>
<canvas id="canvas" width="600" height="300" ...
点击这里可以看动画效果：
http://www.108js.com/article/article3/zip1/30229/Test2.html
效果图：
代码：
<!DOCTYPE HTML>
<html>
<body>
<canvas id="myCanvas" width="500" height="500" >your browser does not support the canvas tag </canvas>
<script type="t ...
点击这里可以看动画效果：
http://www.108js.com/article/article3/zip1/30229/Test.html
效果图：
代码：
<html>
<head>
<meta charset="gbk">
<title>HTML5 绕四边运动的文字</title>
<link type="text/css" rel="stylesheet" href="css/main.css" />
&l ...
点击下面链接可看动画：
http://www.108js.com/article/article3/zip1/exam/a.html
效果图：
代码：
var canvas = document.getElementById("gameBox");
var context = canvas.getContext("2d");
var imglen = 14; //需预加载的图片数量
/*游戏主对象*/
var FlGame = {
grade : 2, //关卡
loadImgLen : 0, //已加载的图片数量
...
美防长来了，不希望中国与美国在未来开战，HTML5 画个星条旗（美国国旗)祈祷。
代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="gbk">
<title>美国国旗</title>
</head>
<body>
<canvas id="canvas" width="741" height="390">你的浏览器不支持HTML5</canva ...
国旗的标准画法图。
代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="gbk">
<title>中国标准国旗</title>
</head>
<body>
<canvas id="canvas" width="600" height="400"></canvas>
<script>
/**
使用H ...