摘要：[gulpjs](http://gulpjs.com/)是一个前端构建工具，与[gruntjs](http://gruntjs.com/)相比，gulpjs无需写一大堆繁杂的配置参数，API也非常简单，学习起来很容易，而且gulpjs使用的是nodejs中[stream](http://nodejs... 阅读全文

摘要：有时候我们需要利用js来动态生成页面上style标签中的css代码，方法很直接，就是直接创建一个style元素，然后设置style元素里面的css代码，最后把它插入到head元素中。但有些兼容性问题我们需要解决。首先在符合w3c标准的浏览器中我们只需要把要插入的css代码作为一个文本节点插入到style元素中即可，而在IE中则需要利用style元素的styleSheet.cssText来解... 阅读全文

摘要：我之前写过一篇文章《文件上传利器SWFUpload使用指南》，里面介绍了上传组件SWFUpload的使用方法，但现在随着html5技术的逐渐推广和普及，再去使用以flash为上传手段的SWFUpload显然就有点过时了，毕竟html5原生的就给我们提供了文件上传的API。Plupload是一款由著名... 阅读全文

摘要：用js来实现动画，我们一般是借助setTimeout或setInterval这两个函数，css3动画出来后，我们又可以使用css3来实现动画了，而且性能和流畅度也得到了很大的提升。但是css3动画还是有不少局限性，比如不是所有属性都能参与动画、动画缓动效果太少、无法完全控制动画过程等等。所以有的时候我们还是不得不使用setTimeout或setInterval的方式来实现动画，可是setTimeo... 阅读全文

摘要：我们在写js代码时有时需要判断某个对象是不是DOM对象，然后再进行后续的操作，这里我给出一种兼容各大浏览器，同时又算是比较稳妥的一种方法。 要判断一个对象是否DOM对象，首先想到的无非就是它是否具有DOM对象的各种属性或特征，比如是否有nodeType属性，有tagName属性，等等。判断的特征越多，也就越可靠，因为毕竟我们自定义的js对象也可以有那些属性。还有其他方法吗? 在DOM Level2... 阅读全文

摘要：在上一篇教程中我们完成了boot、preload、menu这三个state的制作，下面我们就要进入本游戏最核心的一个state的制作了。play这个state的代码比较多，我不会一一进行说明，只会把一些关键的东西挑出来说。我们点击游戏菜单中的开始按钮后，首先出现的是这个画面：在第一部分的教程中，我们... 阅读全文

摘要：Phaser是一个简单易用且功能强大的html5游戏框架，利用它可以很轻松的开发出一个html5游戏。在这篇文章中我就教大家如何用Phaser来制作一个前段时间很火爆的游戏：Flappy Bird，希望大家看后也能做出自己的html5游戏。大家可以先点击这里来试玩一下我已经做好的这个游戏，感受一下P... 阅读全文

摘要：node-webkit是一个Chromium和node.js上的结合体，通过它我们可以把建立在chrome浏览器和node.js上的web应用打包成桌面应用，而且还可以跨平台的哦。很显然比起传统的桌面应用，在某些特定领域用html5+css3+js开发的web应用更加简单和高效，而且还可以使用node.js的功能，所以node-webkit还是很有用处的。 下面我通过一个简单的demo来介绍怎么样... 阅读全文

摘要：这里说的js跨域是指通过js在不同的域之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。只要协议、域名、端口有任何一个不同，都被当作是不同的域。下表给出了相对http://store.company.com/dir/page.h... 阅读全文

摘要：deferred对象是什么？能吃吗不能吃。简单的来说，deferred对象是从jquery-1.5开始引入的一个新东东，是一个能使我们更方便的处理各种延时或异步事件（也不知道用事件这个词合不合理，我也不知道在怎么讲啦）的工具。我们知道这些延时或异步事件最终都是要靠回调函数来处理的，deferred对象的出现就是为了能帮助我们更好的管理这些回调函数，并且能使我们的写出的代码更加清爽、可读。说这些有什么用，举个例子呗额。。。好吧。说到异步，脑子里的第一反应当然是ajax了。先看下jquery中一个典型的ajax写法:$.ajax({ url:'test.php', success: 阅读全文

摘要：SWFUpload是一个flash和js相结合而成的文件上传插件，其功能非常强大。以前在项目中用过几次，但它的配置参数太多了，用过后就忘记怎么用了，到以后要用时又得到官网上看它的文档，真是太烦了。所以索性就把它的用法记录下来，也方便英语拙计的同学查看，利人利己，一劳永逸。(ps：SWFUpload早... 阅读全文

摘要：在js中，总的来说数据类型分为两大类，一类是原始值类型的，一类是引用类型的。原始值类型的包括：字符串(String) 、数字(Number) 、布尔值(Boolean) 以及两个特殊的值 null 和 undefined 。引用类型的主要是指对象，在js中，对象的范围很广，甚至有js中一切都是对象这样的说法。对象可以分为 对象(Object) 以及更具体的数组(Array) 、 函数(Functi... 阅读全文

摘要：先看代码： 非IE浏览器效果： IE浏览器效果： 注意到在IE中，代码中的<style>p{background:#f00}</style> 这段样式声明并没有起作用。 解决方法：在样式表前必须要有其他的html代码，即使是一个 &nbsp 也行。 参考：http://since2006.com/blog/83/innerHTML-CSS-style ... 阅读全文

摘要：现在有许多成熟的js模块加载器，比如requirejs和seajs等，但是对一些小的项目来说，它们的功能可能太过于“强大”，也许我们只是想要有一个能动态加载js的功能，或许我们只是想装B一下，让自己写出的页面没有一大堆的<script src=”a.js”></script>这样的东西。前面说的两种js加载器都是更强调模块性，也就是更强调js文件的组织和管理，更适用于大的项目。就像刚刚说的，我只想有一个js文件加载器，我只需提供给它一个js文件的地址就行了的那种呢？那就进入我们的主题了，使用headjs吧。headjs其实是一整套的工具，但我只想介绍的是它其中的Java 阅读全文

摘要：这种情况用在需要填写银行卡等数字较长的地方就能派上用场啦。今天温习了下正则表达式，就当练练手了。 var str='456026658747301614';var str=str.replace(/(\d{4})/g,'$1 ').replace(/\s*$/,'');alert(str); 阅读全文

摘要：var str='123456789';var str=str.split('').reverse().join('').replace(/(\d{3})/g,'$1,').replace(/\,$/,'').split('').reverse().join('');alert(str);只要理解得透彻，正则表达式真心是强大 阅读全文

摘要：瀑布流布局在目前貌似很火爆，具体的分析、原理、用到的知识等等可以看看以下几位牛人写的东西。瀑布流布局浅析浅谈个人在瀑布流网页的实现中遇到的问题和解决方法折腾:瀑布流布局（基于多栏列表流体布局实现）javascript 瀑布流、各大瀑布流简析与建议因为自己用jquery比较多，便萌生了把瀑布流做成插件的想法，图片就借用迅雷UED上的那些美图吧。先看看Demo把代码放出来吧;(function($){ var //参数 setting={ column_width:204,//列宽 column_className:'waterfall_column',//列的... 阅读全文

摘要：一、定义 getBoundingClientRect 函数是W3C组织在第一版本的W3C CSSOM View specification草案中确定的一个标准方法，在此之前，只有IE浏览器是支持该方法的，W3C在这次草案中把它扶正成为标准，足可以看出它并不简单。getBoundingClientRect 方法返回的是调用该方法的元素的TextRectangle对象，该对象具有top、left、right、bottom四个属性，分别代表该元素上、左、右、下四条边界相对于浏览器窗口左上角（注意，不是文档区域的左上角）的偏移像素值。二、兼容性 getBoundingClientRect方法最先在IE 阅读全文

摘要：什么是CSSOM视图模型，这里就不解释了，有兴趣的童鞋可以到官网去看下。这里只说说几个很有用却容易混淆的属性，这几个属性兼容性都蛮不错的，基本不用太关注浏览器环境。clientLeft 与 clientTop返回元素内容区域左上边界（包含padding,并且是可见区域）相对于元素整个区域左上边界(包含边框，但不包含margin)的偏移距离，兼容常见浏览器(指ie6+,firefox 3.0+,chrome 4+,opera 10.10+,safari 4.0+等浏览器，后文相同)ps:可见区域是指我们能看到的部分，即不包括超出隐藏部分或是有滚动条时被隐藏的那部分。再ps:后文中如再提到元素的内 阅读全文

摘要：1、input type=button /及其他input元素 与 button/button会产生对不齐的现象，所以最好要保持一致性2、input的name属性命名以及用ajax发送数据的时候的参数命名不能太随意，比如命名为一个a,这样会导致未知的错误3、在绝对定位时，如果绝对定位元素的父元素有负边距，就会对IE6或7（8不知道）的定位参照点产生影响，具体情况还有待测试 阅读全文