这篇文章通过一张图清晰地讲述了 scrollTop, offsetTop, scrollLeft, offsetLeft 等的区别。

用好 JavaScript 并不容易，你除了需要掌握它的语法并知道如何写出高质量的代码之外，还需要了解如何解决那些几乎在每个项目中都会遇到的需求场景，比如：判断日期，高亮文本，限制字符数等等，有很多第三方库可以解决这些问题，但这些库可能并非只是为解决这一个问题而创建的，这意味着你需要引入了很多无关的代码，这将使你的整个系统变得臃肿，而且也会影响到系统的性能。我的做法是，收集和使用那些常见的 JavaScript 代码段，并在需要时，尽可能首先使用它们。下面便是我收集的 10 段实用 JavaScript 代码，基于它们你还可以创造出更强大的 JS 插件或功能函数。

文档，教程，模版资源等等

为前端开发者、设计师带来灵感的 10 个酷站，与大家分享。Have Fun！

本文标题:实现图片懒加载(lazyload)文章作者:Jake发布时间:2016-11-26, 18:46:34最后更新:2016-11-28, 17:12:59原始链接:http://i.jakeyu.top/2016/11/26/实现图片懒加载/许可协议: "署名-非商用-…

通常来说，Web 页面开发的流程大致是这样的：设计师（设计师不是美工，就像程序员不是码农一样）提供设计稿，通常是图片格式。然后前端的开发人员（在ThoughtWorks我们称之为UI Dev）来手工的将图片转换为对应的HTML+CSS，往往还需要在各个浏览器中调试等。

对于 Bootstrap，首先要介绍而是它的整体架构——它到底由什么组成的。相信大家看下面一张图就可以很快明白 Bootstrap 中具体由哪些东西组成的。希望通过本文可以让初学者快速理解和掌握 Bootstrap。另外本文相当于是 Bootstrap 要领吧，关于更详细的内容大家可以自行参考 Bootstrap 中文官网。不过我觉得没不要了，有那样的时间还不如就直接实践起来呢。

作为一名前端 “攻城狮”，实现所有需求的页面布局是最基本的技能。下面的内容，给大家介绍一些复杂的布局。

涉及到了：元字符、字符转义、重复、字符类、分枝条件、反义、分组、后向引用、零宽断言、负向零宽断言、注释、贪婪与懒惰、处理选项、平衡组/递归匹配