今天继续和大家分享一个jQuery弹出框的代码。代码本身很简单，最关键的问题就在于兼容性方面。

HTML CODE:

<a class="popBtn" href="javascript:void(0)">Click Me</a>

<div class="popLayer">
	<div class="popLayerTit">
		<h2>Title</h2>
		<i class="close">[ 关闭 ]</i>
	</div>
	<div class="popLayerCon">
		<p>Text or Other content</p>
	</div>
</div>
<div class="maskLayer"></div>

[ 查看全文... ]

引言：瀑布流式布局（又名：瀑布图片墙），而Pinterest则是该布局的鼻祖。最该布局形式最初在国内默默无闻，但随着蘑菇街、点点和花瓣网等等的兴起...这样的布局方式也渐渐被人们所熟知。可能有人不经意要问，为什么现在越来越多的网站都这样效仿呢？我个人总结了2点：首先，图片+链接的方式，方便了用户浏览，也能清晰找到相关内容，可谓是一目了然。其次，看似散乱无序的碎片化内容，有着强大的视觉感染力。由于内容随机和不确定性，更能够诱导用户反复查看，有时更像是种“探宝”希望找到自己所喜欢的内容。

好了，说了一堆介绍，开始进入正题。其实，这个Demo很早就开始制作了，由于种种原因，一直没能写这文章。由于最近在做一个项目，需要用到这个布局方式，也所谓是不用不知道，一用才知道，看似没什么问题，但在实际应用中，还是有很多问题需要解决。所以，边做项目的同时，也把Demo优化、更新了下。 [ 查看全文... ]

这是我在一个国外网站上看到的Loading动画效果。实现起来很简单，但是很有FEEL的样子，所以就贴出来分享分享。
[ 查看全文... ]

由于现在主要接触移动端，不需要考虑IE等古董浏览器的兼容性问题，所以能最大程度的使用CSS3所带来的便捷。

在近期的一个项目中，根据设计需求，需要把图片以倾斜5度的方式来呈现出效果。于是便做了一个例子：-moz-transform: rotate(5deg);-webkit-transform: rotate(5deg); 把图片旋转了5度。本以为轻而易举，可遇到了问题。在Fireofx中显示正常，但在webkit内核下的浏览器中，如Chrome和Safari，图片边缘会有很明显锯齿。也可以说是webkit抗锯齿的一个BUG。另外需要补充的一点，如果图片上级元素含有overflow:hidden;属性，则会让锯齿感更明显。 [ 查看全文... ]

可能我有一些小小洁癖，那就是看到好看、炫酷的网页效果都会忍不住想自己也制作一份，哪怕事模仿，也必须自己手动敲一边代码。自己身边也囤积了蛮多的实例，今后我会陆续把以前写的一些CSS3和jQuery案例拿出来分享并加以注释，一方面提供给大家，一方面也算是温故而知新吧。

今天所展示的案例，主要使用到了2个CSS3属性animation和keyframes。如果大家会Flash，相信就会很容易搞懂。根据例子中的代码，我们可以这样理解：
animation：实例名称 动画时长 动画方式;
keyframes：实例名称 { 从{起始位置} 到{结束位置} }; [ 查看全文... ]

以tJrus的实例为参考，自己也制作了个，就当陶冶情操吧。整个页面没用一张图片，打开速度绝对给力。功能方面，时间有限，只做了个最简单的开机关机效果-。-莫要拍砖 嘿嘿 [ 查看全文... ]