摘要：
GruntMate是什么? 一个基于Grunt的项目管理可视化工具（还不知道Grunt是什么？可以谷歌一下就知道了！）GruntMate有哪些功能？方便的管理基于Grunt的项目方便统一管理Grunt插件提供可视化启动、停止Grunt项目监听Gruntfile.js文件变化，自动重启Grunt任务方便搜索定位Grunt日志uglifyjs的压缩/美化图片转base64雪碧图合并功能GruntMate下载在使用中有任何问题，欢迎反馈给我博客园文件上传大小，弄不上去，大家可以到github上下github:https://github.com/floydcash/gruntmate欢迎大家X一下. 阅读全文
摘要：
之前写的小游戏，要么就比较简单，要么就是比较难看，或者人物本身是不会动的。结合了其它人的经验，研究了一下精灵运动，就写一个简单的小游戏来试一下。介绍一下几个主要的类：Frame：帧的定义，主要描述动画的一帧Animation：动画的定义，主要描述一个连贯的动画，由多个帧组成Sprite：精灵的定义，主要描述一个完整的实体，由多个动画组成TimeProcess：时间管理，由requestAnimationFrame完成Person：一个完整人定义，就是主人公--男人BlockBase：块的基类，下降中的障碍物基类，包含一些基本的参数与方法NormalBlock：普通块，继承于BlockBase， 阅读全文
摘要：
使用Grunt遇到的问题？必须要安装NodeJS必须安装grunt-cli需要编写复杂的Gruntfile.js规则每个项目中必须存在nodejs的grunt模块不方便管理每一个包含grunt的项目无法快速开始一个项目解决思路直接把NodeJS跟grunt-cli包含进去？弄个有UI的界面来管理？用程序简化gruntfile的规则？将所有项目中需要的grunt模块包含到一起？默认内置一些常用功能模块？解决方案 -- nodewebkit集成了nodejs，省去NodeJS安装集成webkit内核，方便编写界面适合前端人员开发一次开发，兼容三大平台window/mac/linux遇到问题一.如何 阅读全文
摘要：
很久没有更新博客了，最近比较忙，而且也没什么idea！最近看了一个坦克大战的html5源码，发觉颇有收获。所以抽空写了一个相对于以前的小游戏复杂些的塔防游戏！也算是一种对于自身的突破！虽然是demo版，也不能太丑，所以我还是找了一些素材图片，找素材图片还真麻烦！本次用到了5个canvas画布标签！map：用于绘制背景地图，基本上画上一次就不会重画。main：用于绘制敌人与子弹，因为这两个基本上会一... 阅读全文
摘要：
当我们需要连续执行几个函数，而这几个函数会一直对页面元素进行操作时，很可能页面会出现短暂的卡，然后，一下子爆炸性的出现所有信息。一般我们会用setTimeout(fn,0);这种来执行，其实js的setTimeout，特别是IE6的，响应时间最快也要17毫秒左右，所以，设置成0，意义不大。而且，这种做法，存在不连续，不连贯性。所以，自己写了个简单的。1/**2*@authorfloyd3*@name异步处理事件队列4*@examplevarqe=newQueneEnginer();qe.add(fn,context,arrParam);qe.start();5*/67varQueneEngin 阅读全文
摘要：
最近在android手机上，发现一款小游戏，叫跳云，玩法很简单，点击一下屏幕，小人就会往下跳，要站在云上，不然就结束了，在跳的过程中，会收到风的影响，使下落偏移。所以我就想用js来迅速山寨一个来试试。发觉以前的js游戏，都是用了很多个setTimeout的计时器，效率不咋D，所以采用html5的写法来写js游戏，用一个setInterval来实现。思路跟以前很不同。玩法很简单，单击游戏屏幕就可以了，注意风向。风向：无层数：0UI就做得比较粗糙啦。。。BUG也会有的。。。希望大家会喜欢。。。注释源码上都有完整源码>>顺带说一句，在偶然的机会，发现，竟然有人用我的js小游戏去参加IE9 阅读全文
摘要：
好久没写过小游戏了，最近抽时间写了一个，看了一些高人写的游戏，无限感慨呀。。。也从中学到了不少东西。我不会写什么大的游戏，因为需要很多时间与精力，而且自认水平有限，个人喜欢写些小游戏。这次的游戏是【是男人就忍30秒】，游戏玩法很简单，就是用键盘控制飞机，飞来飞去，躲开子弹，看你能撑多久。本来是打算写一个教程来一步步说明的，但后来想了想，还是算了，免得误人子弟，在源码上加些注释就可以。没有测试过IE... 阅读全文
摘要：
自己总结出来的使用方法。。。。Mark一下！1。循环绑定No Use：[代码]结果：点击每一个li，都是弹出lists.length的值。原因：onclick事件中的i值只是引用，最后循环执行完了，i = lists.length。 Use：[代码]结果：点击每一个li，弹出对应li的编号i值。原因：将i值传递进内部的函数中，此时函数已经执行了，所以，i这个值就是当时的值。2。配置对应访问No Use：[代码]结果：返回需要的配置值。分析：每次调用都需要重新定义list变量以及赋值; Use：[代码]结果：返回需要配置值。分析：只需要定义与赋值一次list变量。3。封装类No Use：[代码] 阅读全文
摘要：
延迟执行，其实就是用到了setTimeout这个函数。善于利用这个函数，可以减少很多ajax的请求，以及dom操作。1。延迟切换tab需求：页面上有几个tab，切换tab的时候，会对某个特定区域的数据进行拉取更新。弊端：用户从第一个tab切换一直快速切到尾，就会产生n个ajax请求。其实用户只是需要看到最后一个tab的数据。[代码]一个比较简单的例子，绑定在tab上的onmouseover，如果用户不停的来回切换tab，ajax请求不会执行，只有停顿500毫秒后，才会执行，500毫秒，其实蛮短的，基本上不会影响到用户体验。2。延迟自动完成需求：在文本输入框中，监听用户输入，实现自动完成功能。弊 阅读全文
摘要：
在这个万恶的IE6还生存的年代，我们很多时候都会遇到一些莫名其怪的诡异bugs，而这些很大部分都是来源与IE6。1。神奇的cursor[代码]这段看起来很普通的代码，却蕴藏着一个bug，就是在IE6下，当鼠标离开时，a标签的样式cursor:url("none");同时会产生一个404的请求，其它浏览器，一切正常。解决方案：cursor="default"；就没事了。2。神奇的a标签地址[代码]当动态修改A标签的href的值，其值存在email的格式，IE6就会很智能的把innerHTML的值也改为href的值，其它浏览器一切正常。解决方案：在email地址前加个空格就可以了。3。神奇的a标签 阅读全文