杰拉斯的博客

[常用布局]左栏固定宽度，右栏自适应的两种纯CSS方法

杰拉斯 杰拉斯 | 时间：2013-08-26, Mon | 34,113 views
前端开发　

其一，左栏固定宽度，右栏自适应之绝对定位法：

<!doctype html>
<html lang="zh-CN">
<head>
	<meta charset="UTF-8">
	<title>左栏固定宽度，右栏自适应之绝对定位法</title>
	<style type="text/css">
	body{
		margin: 0;
	}
	#nav{
		top: 0;
		left: 0;
		width: 230px;
		height: 600px;
		background: #ccc;
		position: absolute;
	}
	#main{
		height: 600px;
		margin-left: 230px;
		background: #0099ff;
	}
	</style>
</head>
<body>
	<div id="container">
		<div id="nav">
			左栏
		</div>
		<div id="main">
			右栏
		</div>
	</div>
</body>
</html>

看起来很美好，但是。。

由于左栏使用绝对定位，脱离了文档流，因此有一个缺陷，即当左栏高度大于右栏时，无法将container撑开，这个缺陷单单只看两栏布局并没有太大影响，但如果两栏布局下面有一个底栏，就会出现底栏与左栏重叠的情况

(阅读全文…)

[转载]jQuery最佳实践

杰拉斯 杰拉斯 | 时间：2013-08-24, Sat | 18,556 views
前端开发　

上周，我整理了《jQuery设计思想》。

那篇文章是一篇入门教程，从设计思想的角度，讲解"怎么使用jQuery"。今天的文章则是更进一步，讲解"如何用好jQuery"。

我主要参考了Addy Osmani的PPT《提高jQuery性能的诀窍》（jQuery Proven Performance Tips And Tricks）。他是jQuery开发团队的成员，具有一定的权威性，提出的结论都有测试数据支持，非常有价值。

(阅读全文…)

[转载]jQuery设计思想

杰拉斯 杰拉斯 | 时间：2013-08-23, Fri | 19,502 views
前端开发　

jQuery是目前使用最广泛的javascript函数库。

据统计，全世界排名前100万的网站，有46%使用jQuery，远远超过其他库。微软公司甚至把jQuery作为他们的官方库。

对于网页开发者来说，学会jQuery是必要的。因为它让你了解业界最通用的技术，为将来学习更高级的库打下基础，并且确实可以很轻松地做出许多复杂的效果。

虽然jQuery上手简单，比其他库容易学会，但是要全面掌握，却不轻松。因为它涉及到网页开发的方方面面，提供的各种方法和内部变化有上千种之多。初学者常常感到，入门很方便，提高很困难。

目前，互联网上最好的jQuery入门教材，是Rebecca Murphey写的《jQuery基础》（jQuery Fundamentals）。在Google里搜索"jQuery 培训"，此书排在第一位。jQuery官方团队已经同意，把此书作为官方教程的基础。

这本书虽然是入门教材，但也足足有100多页。我对它做了一个详细的笔记，试图理清jQuery的设计思想，找出学习的脉络。我的目标是全面掌握jQuery，遇到问题的时候，心里有底，基本知道使用它的哪一个功能，然后可以迅速从手册中找到具体的写法。

下面就是我的笔记，它应该是目前网上不多的jQuery中文教程之一。你只需要一点javascript语言的基本知识，就能看懂它，在最短的时间里，掌握jQuery的所有主要方面（除了ajax和插件开发）。

(阅读全文…)