HTML5移动开发学习笔记之Canvas基础

【HTML5移动开发学习笔记之Canvas基础】的更多相关文章

HTML5移动开发学习笔记之Canvas基础

1.第一个Canvas程序看的是HTML5移动开发即学即用这本书,首先学习Canvas基础,废话不多说,直接看第一个例子. 效果图为: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <style type="text/css"> canvas { border-width: 5px; border-style: dashed; b…

HTML5移动开发学习笔记之CSS3基础学习

CSS回顾在学CSS3之前首先巩固下CSS的基础知识. 1.CSS框模型举例子: #box { width: 70px; margin: 10px; padding: 5px; } 这个代码将出现的效果是: 2.CSS定位与浮动 1)定位: 属性描述 position 把元素放到一个静态的(static:元素框正常生成),相对的(relative:元素框偏移某个距离[相对定位实际上被看作普通流定位模型的一部分,因为元素的位置相对于它在普通流中的位置]),绝对的(absolute:元素框从…

【整理】HTML5游戏开发学习笔记（1）- 骰子游戏

<HTML5游戏开发>,该书出版于2011年,似乎有些老,可对于我这样没有开发过游戏的人来说,却比较有吸引力,选择自己感兴趣的方向来学习html5,css3,相信会事半功倍.不过值得注意的是,该书的游戏是些小的游戏,内容相对比较基础,而且html5标准已经正式发布,可能会和书中所描述有少许出处.当然了,书中的小游戏还是比较不错的,适合我这样的前端开发不咋地的来练手,学习方式是在以自己的思路实现之后,再来看书中的实现思路,因为每个人有自己的开发习惯. 1.预备知识在做第一个骰子游戏开发前,必须知…

【整理】HTML5游戏开发学习笔记（5）- 猜谜游戏

距上次学习笔记已有一个多月过去了,期间由于新项目赶进度,以致该学习计划给打断,十分惭愧.书本中的第六章的例子相对比较简单.所以很快就完成. 1.预备知识html5中video标签的熟悉 2.实现思路对20组G20成员进行国家名和其首都的匹配的游戏.通过2组div来显示,监听其点击事件click,通过元素的id保存国家和首都的索引,通过前后2次的点击来判断其2次点击的索引是否相等,相等则匹配成功,不相等则继续.全部匹配成功后则自动播放视频. 3.主要代码 var membersForG20 = […

ios开发学习笔记001-C语言基础知识

先来学习一下C语言基础知识,总结如下: 在xcode下编写代码. 1.编写代码 2.编译:cc –c 文件名.c 编译成功会生成一个 .o的目标文件 3.链接:把目标文件.o和系统自带的库合并在一起,生成一个可执行文件. 指令:cc 文件名.o 链接成功会生成一个.out可执行文件,选择用终端打开运行. 4.运行:./a.out //也可以双击a.out运行 ./表示当前路径也可以同时编译并链接指令:cc a.c 可以直接在终端里生成文件,生成一个源文件到当前目录指令:touch a…

HTML5移动开发学习笔记

最近做webapp项目过程中,发现坑还是挺多的,以下是网络收集一些开发中的常见问题及知识汇总,以便查阅,慢慢更新:). meta 基础知识 H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" /> 忽略将页面中的数…

【整理】HTML5游戏开发学习笔记（2）- 弹跳球

1.预备知识(1)在画布上绘制外部图片资源(2)梯度(gradient):HTML5中的对象类型,包括线性梯度和径向梯度.如createLinearGradient,绘制梯度需要颜色组http://www.w3school.com.cn/tags/canvas_createlineargradient.asp function test1(){ //在画布上绘制外部图片资源 var ctx = document.getElementById('ballCanvas').getContext('2…

【整理】HTML5游戏开发学习笔记（4）- 记忆力游戏

1.预备知识(1)Canvas绘制多边形(2)Canvas绘制文字 2.实现思路涉及的对象 (1)场景Scene 场景代表了画布上的一块区域,场景里的每个物体都是场景里的一个元素,其绘制统一由场景来调用绘制 (2) 扑克牌Card 包括翻开,关闭,移除等操作 (3)一副扑克牌Deck 包括洗牌 (4)游戏玩法PlayingRule 每次选择2张扑克进行比较,相等则消除(移除),不相等,则进行下一次的2张牌的选择 ,在进行比较 3.主要代码 /*场景*/ function Scene(ca…

【整理】HTML5游戏开发学习笔记（3）- 抛物线运动

1.预备知识(1)Canvas旋转的实现过程 window.onload = function(){ var ctx = document.getElementById('canvas1').getContext('2d') //旋转 ctx.save() ctx.translate(200,200)//把(200,200)点作为临时的(0,0)点 ctx.rotate(30*Math.PI/180)//顺时针旋转30度所对应的弧度 ctx.fillRect(0,0,100,150) ctx.r…

Rest API 开发学习笔记(转)

Rest API 开发学习笔记概述 REST 从资源的角度来观察整个网络,分布在各处的资源由URI确定,而客户端的应用通过URI来获取资源的表示方式.获得这些表徵致使这些应用程序转变了其状态.随着不断获取资源的表示方式,客户端应用不断地在转变着其状态,所谓表述性状态转移(Representational State Transfer). 这一观点不是凭空臆造的,而是通过观察当前Web互联网的运作方式而抽象出来的.Roy Fielding 认为, “设计良好的网络应用表现为一系列的网页,这些网…