叶落为重生每片落下的叶子都是为了下一次的涅槃...^_^

摘要： 【前言】这篇博文旨在给自己做个记录和备忘，同时希望也能给有这方面简易碰撞模型需求的同学一点点参考价值。【关于像素级别检测】前一阵有同学问我说能否做到像素级别的碰撞检测，做过类似碰撞检测的同学应该清楚，按照我们最常规的想法，假如要检测一个运动的物体和一条线之间是否有碰撞，最简单的判断条件，就是看当前帧，这个物体的位置，是否超过的我们的界定范围...但这样简单的判定确实是有问题的，我们举一个实际一点的例子。假如 小球 从 a 点向 c 点的方向 落下。外面的黑框为我们所示的边界，那么，我们想要小球在碰到边界的时候反弹... 那么我们该怎么做呢？可能有同学会迫不及待说了，这还不简单，一个 条件语句搞 阅读全文

摘要： 上周为AlloyTeam/JX做了个简单的官网http://alloyteam.github.com/JX/，当时文档，demo以及其他的附属工具都还没完善，地址就流了出去...独立的粒子特效demo 可以看这里http://hongru.github.com/proj/laro/examples/jxhome/JX 作为webqq的底层，框架本身怎么样，我这里暂时不作评论，很多同学对JX官网home页的opening动画的实现很感兴趣，我这里就简单说一下实现的思路。应该没有大家想象中麻烦。【关于canvas的使用】home页的粒子效果 其实是受启发于 Google 2011年的I/O 大会的 阅读全文

摘要： 经过断断续续折腾。关于html5 canvas 的一个游戏引擎的底层框架部分大致完成了。现在是version 0.1， 还有很多不完善的地方，或者是bug。亦或设计不合理的地方。我把地址放出来，正好我看院子里也有些同学写html5 的小游戏或者 游戏引擎。 感兴趣的同学可以大家互相交流一下，互帮互助，一起成长。关于Laro ，放在github上https://github.com/hongru/Laro或者https://github.com/AlloyTeam/Laro都可以看到源码。感兴趣的同学，或者有好的意见建议的同学 可以在上面留言。互相交流。如果说是游戏引擎，目前还仅仅完成了30%- 阅读全文

摘要： 【写在前面的话：】前不久刚看到过一句话：说好的技术文章应该让读者感觉增加信心，而不是失去信心。有感于这句话是因为以前觉得发一些貌似高深的，看起来nb的东西才算一篇好博文，可是多少有点炫技的成分。可是后来越发觉想把一个看起来简单的问题说通透也着实不易。我希望今后的文章多少能带给更多的读者一些帮助吧。 这是我的目标之一。web前端，确实算编码里面的挺特殊的一个职位，不仅仅要理性的编码，还要感性的接触UI，通常我都把这种工作叫做需要情商的码字工作者。要说前端有多难，我想会被很多做算法或者底层的同学所不齿。确实，前台的工作并不算难，尤其是web端的前台，有困难的部分，那也是少数。所以在互联网发展初期， 阅读全文

摘要： 好久没有更新blog了。今天终于有了心再写一篇。算是对自己工作和生活的一种回顾吧。11年底和12年初的时候自己都没有写什么总结性质的博文，或者之类的东西。但是心里确是有稍微对过去的时间做一点结算工作的。【关于个人】过去差不多一年的时间里。做的事情不多，但是其实也不少。我这里都可以大概列出除了日常在公司工作之外自己在业余为自己专业提升而做的事情。在自己的github上面，去年有不少更新。主要的工作集中在3个较为大的项目上面。一个是自己一点一点累计起来的关于javascript的基本lib。取名叫做Leta,内容倒没什么特别值得说的，都是根据工作经验和工作需求累积起来的关于前端工作的基本脚本库。当 阅读全文

摘要： 【已知】canvas提供了toDataURL的接口，可以方便的将canvas画布转化成base64编码的image。目前支持的最好的是png格式，jpeg格式的现代浏览器基本也支持，但是支持的不是很好。【想要的】往往这么简单直接的接口通常都满足不了需求。我想要的不仅是简单的通过画布生成一个png，我不想新开一个tab，然后还要右键另存为...我还需要更方便的自由的配置生成的图片的大小，比例等。另外如果我还要别的图片格式，比如位图bmp，gif等怎么办...【解决办法】a)想直接把图片生成后download到本地，其实办法也很简单。直接改图片的mimeType，强制改成steam流类型的。比如‘ 阅读全文

摘要： 我们的图片大部分都是可以转换成base64编码的data：image。 这个在将canvas保存为img的时候尤其有用。虽然除ie外，大部分现代浏览器都已经支持原生的基于base64的encode和decode，例如btoa和atob。（将canvas画布保存成img并强制改变mimetype进行下载，会在下一篇记录）但是处于好奇心，还是驱使我去了解下base64编码的原理。以便也在不支持原生base64编码的ie下可以得以实现。【Base64】-base64的编码都是按字符串长度，以每3个8bit的字符为一组，-然后针对每组，首先获取每个字符的ASCII编码，-然后将ASCII编码转换成8b 阅读全文

摘要： 飞行射击类游戏很常用的追踪子弹，或者塔防里面固定炮台打 怪物的时候，为了保证子弹不会打空，追踪是必要的。然而，这是极其简单的事情。在每一帧里判断当前子弹和目标位置的距离和方向，不断修正 速度方向即可。// this.x, this.y 表示当前子弹的位置// this.tar.x, this.tar.y 表示当前目标的位置var dis = Math.sqrt(Math.pow((this.tar.x-this.x), 2) + Math.pow((this.tar.y - this.y), 2));var angleX = (this.tar.x - this.x)/dis;var angl 阅读全文

摘要： 原文链接：http://oldj.net/article/flip-images-in-html5/ 貌似 HTML5 的 Canvas 只提供了图片的旋转、缩放功能，没有提供图片翻转（水平翻转或垂直翻转）的支持，搜索加试验之后，得到几种实现图片翻转的方法，记录一下。 第一种最简单的是使用 CSS，代码片断如下：1<style>2.flip-x {3filter: FlipH; /* IE only */4-moz-transform: matrix(-1, 0, 0, 1, 0, 0);5-webkit-transform: matrix(-1, 0, 0, 1, 0, 0);6 阅读全文

摘要： 【已知】不知道大家有木有了解过jQuery1.0到2.0时候针对jsonp那一块的修改。v1.0的时候还在使用iframe作为请求数据的临时暂居地。以便让过往数据有据可查。保证了jsonp请求的时候即便用了同样的全局callback 也只至于先返回的数据丢失，造成数据污染的问题。但是自从jq2.0之后，就不再采用iframe来记录jsonp获得的数据了。可是依然，不得不支持同一个callback名。那么，这样，问题就来了...【问题】jsonp的原理其实就是我们把请求地址当作一个js地址以script tag 的方式插入到页面，把服务端返回的数据当作script 脚本来运行以获得所需的数据（通 阅读全文