2014年11月19日
typeof的一些兼容性问题
摘要： typeof存在一些兼容性的问题，在IE6,7,8中的DOM和BOM元素及其对象上的方法的判定会出现误差，在safari上对NodeList实例的判定，对ExpReg实例的判断（早期的chrome，safari会对ExpReg实例认定为‘function’）。分析： 之所以会在IE6,7,8对DO... 阅读全文
posted @ 2014-11-19 12:37 royalrover 阅读(2170) 评论(0) 推荐(1) 编辑
html标签属性（attribute）和dom元素的属性（property）
摘要： 简介attribute和property都有属性之意，但对于attribute和property的区分其实并不难。从对象来说，attribute是html文档上标签属性，而property则是对应dom元素的自身属性。从操作方法上来看，attribute可以通过dom core规范的接口 getAt... 阅读全文
posted @ 2014-11-19 09:16 royalrover 阅读(9199) 评论(3) 推荐(4) 编辑
2014年11月18日
清除浮动的原理剖析
摘要： 常用的清除浮动的几种方法总结下： 1，手动设置一个标签（在浮动元素下方），然后对其设置clear属性 2，给浮动元素设置 :after伪类，创建块元素，设置clear属性 3，给父元素设置浮动 4，给父元素设置overflow设置非visible值（auto，hidden） 5，给父元... 阅读全文
posted @ 2014-11-18 20:59 royalrover 阅读(442) 评论(0) 推荐(0) 编辑
修正IE6不支持position:fixed的bug（转）
摘要： 众所周知IE6不支持position:fixed，这个bug与IE6的双倍margin和不支持PNG透明等bug一样臭名昭著。前些天我做自己的博客模板的时候，遇到了这个问题。当时就简单的无视了IE6——尽管有几个使用IE6的朋友，一起BS我……但是对于大项目或商业网站，如果有用到这个属性的时候，是不... 阅读全文
posted @ 2014-11-18 13:31 royalrover 阅读(166) 评论(0) 推荐(0) 编辑
2014年11月17日
Callbacks vs Events
摘要： 前言：本文翻译自Dean Edwards的一篇文章，原文地址：http://dean.edwards.name/weblog/2009/03/callbacks-vs-events/。 文章主要指出了用“回调模式实现自定义事件”的一些弊端，同时提出了一种解决方案，即将回调的函数包装成原生事件，... 阅读全文
posted @ 2014-11-17 00:32 royalrover 阅读(334) 评论(0) 推荐(0) 编辑
2014年11月13日
垂直属性
摘要： 元素的盒模型有几个较为重要的属性，本篇文章主要将脚垫聚集在与height相关的属性上。对于一个并未显式设置高度块框来说，其height的高度不仅仅取决去内容的高度，而且还与该块框的宽度有关。宽度越窄，相应的需要容纳相同内容所需要的空间越大，高度越高。而对于一个非替换行内元素而言（所谓非替换元素，就是... 阅读全文
posted @ 2014-11-13 14:54 royalrover 阅读(651) 评论(0) 推荐(0) 编辑
2014年11月12日
jQuery的事件模型
摘要： 前几天自己着重读了jQuery1.11.1的源码，又结合了之前对DE事件模型的分析，最后也实现一个简陋的事件模型。jQuery的事件系统离不开jQuery的缓存系统。jQuery的第一代缓存是直接将数据存储在 缓存体 这个数据结构中，但是需要在元素上添加一个uuid来作为标示，标记在缓存体中的位置。... 阅读全文
posted @ 2014-11-12 15:38 royalrover 阅读(332) 评论(0) 推荐(0) 编辑
Dean-Edward的事件系统实现
摘要： jQuery早期的事件系统，主要借鉴自Dean-Edward的事件模型。虽说早期的该事件模型也有些许bug，诸如： 1，绑定的事件及其处理程序等数据并未存储到缓存中，而是直接存储在dom元素上，这样不仅污染了dom元素，而且还有可能造成隐患，比如在早期的ie下 拷贝元素，顺带着连这些数据都拷贝了... 阅读全文
posted @ 2014-11-12 15:13 royalrover 阅读(280) 评论(0) 推荐(0) 编辑
简单的导航栏实现
摘要： 为了seo优化，导航栏最好标签语义化。最符合语义的莫过于ul，li。在采用多级标签时，可采用控制二级标签ul位置的方式来进行显隐。效果如下：http://jsfiddle.net/tcyangli/mb5yL4uk/具体的html代码： .dropdown,ul{margin: 0;p... 阅读全文
posted @ 2014-11-12 14:59 royalrover 阅读(220) 评论(0) 推荐(0) 编辑
弹窗层效果的实现（非jQuery实现）
摘要： 要想实现弹窗的效果，首先应该创建一个覆盖层maskLayer，以及一个显示层presentLayer。其次，每次弹窗时（除首次弹窗外），maskLayer的显示以及隐藏不应该导致文档流的reflow，但是repaint不可避免。所以对于maskLayer，用以display:absolute;最为关... 阅读全文
posted @ 2014-11-12 14:51 royalrover 阅读(368) 评论(0) 推荐(0) 编辑
居中详解
摘要： 讲解1，单行文本的居中： 单行文本框居中 .center{width:300px;height:300px;line-height:300px;}2, 多行文本的居中： 1） 多行文本框居中。。。。。。。 .c1{width:300px;height:300px; disp... 阅读全文
posted @ 2014-11-12 14:17 royalrover 阅读(352) 评论(0) 推荐(0) 编辑
解决ajax跨域请求 （总结）
摘要： ajax跨域请求，目前已用几种方法实现：1）用原生js的xhr对象实现。 var url="http://freegeoip.net/json/"; //创建xhr对象 function createCORSXhr(url,method){ var xhr=new XMLHttpRequ... 阅读全文
posted @ 2014-11-12 14:15 royalrover 阅读(15229) 评论(3) 推荐(7) 编辑
js实现css3的过渡，需要注意的一点（浏览器优化）
摘要： 大部分浏览器对元素几何改变时候的重排做了优化。据说是这样子，一定时间内本应多次重排的改变，浏览器会hold住，仅一次重排。其中如果使用分离的一步处理过程，例如计时器，依然多次重排。例如，当我们应用transition动画的时候，希望从0px变化到100px. 你如果如下代码：dom.style.le... 阅读全文
posted @ 2014-11-12 14:13 royalrover 阅读(750) 评论(0) 推荐(0) 编辑
reflow和repaint（摘录自张鑫旭的翻译）
摘要： //正文开始关于回流(reflows)与重绘(repaints)，我已经在twitter和delicious上发布，但是并没有在演讲中提到或是以文章形式发布。第一次让我开始思考关于回流(reflows)与重绘(repaints)的问题是在和ParisWeb上的Mr. Glazman做一个firey交... 阅读全文
posted @ 2014-11-12 14:11 royalrover 阅读(1457) 评论(1) 推荐(0) 编辑
负margin的原理以及应用
摘要： margin值与可视化盒模型的宽（高）度之间的关系 阅读全文
posted @ 2014-11-12 14:07 royalrover 阅读(1096) 评论(0) 推荐(0) 编辑