摘要：
在一次项目中，有一次要用到::selection伪元素，然后开发同学问我，CSS中一个冒号和两个冒号有神马区别？这好像真的是个问题，或许很多前端同学对此都有疑惑，查了些资料，证实了下两个符号的区别，简而言之：单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素。W3C关于CSS3选择器的规范中有一段描述：A pseudo-element is made of two colons (::) followed by the name of the pseudo-element.This :: notation is introduced by the current document 阅读全文
摘要：
其实早知道这个属性，但是一直没有去研究过。今天正好在twitter看到这个词，就去研究了下，正好解决了目前遇到的一个小难题，所以分享下。嗯，其实这是个比较简单的CSS3属性。在某个项目中，很多元素需要定位在一个地图层上面，这里就要用到很多绝对定位或者相对定位的元素，但是这样的话，这些浮在上面的div或者其它元素一般都会给个宽高，或者relative的元素可以不给宽高，这个时候，这些元素就会盖住下面的地图层，以至于地图层无法操作。。。然后正好在Google map见到了类似的问题，拿来当例子来说：Google map中左上角的操作区域占位是挺大的，如红色框区域，然后在这个区域是无法操作地图层的。 阅读全文
摘要：
视频体感游戏的核心在于运动的捕获与识别，主要的问题是如何实现运动捕获算法。关于运动捕方式有很多，于是就存在算法选型问题。我们先后实验过三种方式：色域跟踪、Mean shift、帧差。最终综合了一套方案。下面简单介绍下实现方案。原理：分析连续关键帧间差异来确定运动区域。再通过运动特征系数加权，最终得到较为准确的坐标。优点：环境干扰相对较小，且无需特征录入。处理流程：1.通过浏览器getUserMediaAPI启动摄像头并获取视频流2.利用canvas转化图像数据格式3.利用帧差原理获取运动区域(这里用到(grayscale公式)灰度 = R*.299+G*.587+B*.114;我们预先设定了一 阅读全文
摘要：
之前，我们想要实现一个完美的宽度自适应的输入框好麻烦，曾经也被作为对前端技术的一个挑战。类似的常见场景还有100%宽+边框的容器等。遇到这些情况，我们不得不分外小心，因为各个浏览器的表现可能不一致。现在，firefox和webkit相继支持calc()功能了，我们也可以学习下了。calc()是干嘛的？calc()是单词calculate(计算)的缩写，是css3的一个新的长度单位功能，可以使用简单的数学运算。嗯，CSS3越来越高级了。运算规则calc()使用通用的数学运算规则，但是也提供更智能的功能：使用“+”“-”“*”“/”四则运算；可以使用百分比、px、em、rem等单位；可以混合使用各 阅读全文
摘要：
今儿个看蓝色理想的帖子，说到一个字符串换行的问题。通常如果在代码中存储 HTML 代码片段，会使用加号连接字符串的做法。当然这样做会稍微麻烦点，于是有了以下这个生僻的方法：var foo = 'xxx\xxx';alert(foo)结果弹的是：xxxxxx再来加几个空格缩进看看：var foo = 'xxx\ xxx';alert(foo)结果弹的是：xxx xxx那如果不折行呢？var foo = 'xxx\xxx';alert(foo)结果报语法错误了：SyntaxError: malformed hexadecimal character 阅读全文
摘要：
《深入理解 JavaScript 系列》连载于汤姆大叔的博客，源于对 O’Reilly 新书《JavaScript Patterns》的摘要。这里记录一些不错的知识点，巩固下 JavaScript 基础知识。一、编写高质量 JavaScript 代码的基本要点1）全局下的 this 始终指向 window 对象本身2）避免创建隐式全局变量，如 var a = b = 0; 中 a 是本地变量，b 是全局变量3）使用 var 创建的全局变量无法被删除，不通过 var 创建的隐式全局变量可以被删除4）隐式全局变量并不是真正的全局变量，而是全局对象 window 的属性。属性可以使用 delete 阅读全文
摘要：
事件的发生顺序这个问题的起源非常简单，假设你在一个元素中又嵌套了另一个元素-----------------------------------| element1 || ------------------------- || |element2 | || ------------------------- || |-----------------------------------：并且两者都有一个onClick事件... 阅读全文
摘要：
http://www.mangguo.org/addeventlistener-and-handleevent/ 转载自芒果小站使用 addEventListener 可以绑定事件，并传入回调函数。Mozilla 0.9.1 和 Netscape 6.1 之后的版本不但支持传递函数引用，也都允许直接把拥有 handleEvent 方法的对象作为 addEventListener 方法的第二参数。这在 DOM Level 2 的接口定义中也已经做了说明：http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventListener 阅读全文
摘要：
#1使用双等号给布尔变量赋值，很容易联想到 var a = b || 123; 的写法var a = b == 123;#2快速转换为布尔值!!a#3防止页面被 iframe 调用if(top !== window) { top.location.href = window.location.href;}#4将 arguments 参数组转换为真实数组function args() { return [].slice.call(arguments, 0);}args(2, 5, 0); //[2, 5, 0]#5查找数组中的最大值var arr = [2, 3, 45, ... 阅读全文