摘要： 在canvas中做动画是根据时间变化重新将canvas内容重新绘制，这样看起来就感觉是一个连贯的动画了。也就是一帧一帧的概念。每一帧的内容都是不一样的。下面做一个齿轮从左到右滚动的动画。每隔一段时间重新绘制图片，然后移动图片的x轴，将图片旋转。这样就可以看出是滚动的。主要用到canvas的一个绘制图... 阅读全文

摘要： 一般做动画都使用javascript中的setTimeout()和setInterval()2个函数来制作。现在可以使用css3中的动画来制作动画了，而且css3.0中的动画使用了GPU来加速会让动画看起来更加平滑，顺畅。由于css3.0中的动画并不是所有浏览器都支持，因此会有这样的写法:@-moz... 阅读全文

摘要： 当浏览器下载完所有页面HTML 标记，JavaScript，CSS，图片之后，它解析文件并创建两个内部数据结构：一棵DOM树表示页面结构，一棵渲染树表示DOM节点如何显示。在对html页面的操作过程中会改变页面的结构或者页面的外观或者同时改变页面的结构和外观。在过程中,文档可见外观改变很小(如：改... 阅读全文

摘要： 什么是 Canvas？HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。画布是一个矩形区域，您可以控制其每一像素。canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。浏览器支持Internet Explorer 9+, Firefox, Opera, C... 阅读全文

摘要： html中元素的拖动的实现原理是,当鼠标拖动元素时,改变元素的绝对定位的左边left和顶部top的位置.下面以简单的div拖动为例：一、首先对divdragDiv 的css设置成position:absolute绝对定位. 只有当鼠标在目标div上按下时,鼠标拖动中div才改变位置。当鼠标松开时,... 阅读全文

摘要： 在一个项目中要做一个游戏,在这个过程中做了一个简单的9宫格抽奖游戏。大体思路是,点击开始按钮，游戏开始。由一个逐步递增参数 drawStep 来控制格子的背景颜色的改变，游戏停止的位置参数 stopPosition 由随机函数生成，以此来控制格子停止的位置。游戏转动一圈是8个格子,5圈就是40.easeTime参数模拟格子转动的缓步启动和缓步停止。简单抽奖游戏奖品1奖品2奖品3奖品8开始奖品4奖品7奖品6奖品5 阅读全文

摘要： 对于图片多的网站来说，资源加载特别是图片的加载比较重要。如果图片加载过慢导致网页的渲染慢甚至让http请求超时，这会直接导致用户的体验较差，让人明显觉得网页卡。因此需要将图片进行预加载，这样网页显示的时候就不会有很明显的停顿、卡着的感觉。 思路是当图片加载时，先创建一个图片对象，等图片对象完全加载完时出发图片的的onload函数，在onload函数里面触发图片加载完后的当作函数。这样当图片显示时速度会比较快，就可以达到让人觉得图片加载速度快。 ie、opera下，当图片加载过一次以后，如果再有对该图片的请求时，由于浏览器已经缓存住这张图片了，不会再发起一次新的请求，而是直接从缓存中加载过来。. 阅读全文

摘要： 一、 json即javascript对象表示法（javascript object notion）,可读性强、非常适合数据传输。javascript中的对象字面量是json的基础。例如数组、字符串和数值等类型的字面量，如： var anArray=[''hello','world'];//数组 var aString='hello world';//字符串 var aNumber=3.12;//数值 var anObject={};//对象 var aBoolean=true;//布尔值 var aRegExp=/\d/g;//正则表达式 阅读全文

摘要： 在制作圣诞节活动时候要制作下雪的效果。这有2种方法：一、使用js插件,比如基于jQurey的snow.min.js二、使用Html5的绘图API canvas第一种方法简便,要引入jq，对于小页面会有点浪费,因为要引入jq框架。第二种方法会出现兼容性问题,IE9以下的浏览器不支持或者部分支持HTML5,但制作简单方便，效果好。一个简单的html5绘制雪花的示例如下:html部分 js部分： 阅读全文

摘要： JavaScript中的Function对象是函数，Script中的Function（函数）对象的有三大用途。JavaScript中的Function对象是函数，函数的用途分为3类： a.作为普通逻辑代码容器；b.作为对象方法；c.作为构造函数。1.作为普通逻辑代码容器 function multiply(x,y){ returnx*y; } 函数multiply封装了两位数的乘法运算公式： var product=multiply(128,128);//product=16384 创建函数实例的方式有3种。第一种是声明式，即像声明变量一样，将通过function(){}标识符创建的匿名函数. 阅读全文