一起CSS

令人难以置信的纯CSS3图标和Logo

日期：2010-08-31 分类：CSS

尽管被批评为走火入魔，CSS3 痴迷者们仍然在尝试实现各种基于纯 CSS 的图形与图标设计，如果你看到本文介绍的这些精美图标，你绝对不会相信它们完全是由 CSS3 代码生成的。尤其是那套由 Louis Harboe 设计的 iOS 图标，那么微妙的色彩与纹理，真的难以置信。

奥林匹克标志

作者: Doug Neiner

基于纯 CSS，以 em 为单位，可动态调整尺寸，需要浏览器支持 border-radius 属性，目前支持的浏览器包括 Chrome, Safari, Firefox 和 IE9。

阅读全文 >

查看：80 评论：2 标签：CSS3

用Minify加快你的网站速度

日期：2010-08-18 分类：可用性/可访问性

Web 性能越来越被重视，其中很重要的一条是减少 HTTP 请求，减少 HTTP 请求包括很多方面，今天来介绍一下用 Minify 减少网站的 HTTP 请求。

Minify 是 PHP5 应用程序，它能合并、压缩 js 和 css 文件，并且能通过 HTTP gzip/deflate 及一些相关头，优化客户端缓存。

那么以本博客为例来看看 Minify 的效果如何。本博客 js 文件有 5 个，css 文件 1 个。下图是没有使用 Minify 的截图：

阅读全文 >

查看：209 评论：4

jQuery过滤选择器:not在IE中的bug

日期：2010-08-11 分类：前端技术

在《jQuery插件Flip》的第二个例子中 （查看 Demo），写过滤选择器的时候，发现在 IE 下有问题，无法过滤。代码是这样的：

$('.flipbox:not(:first)').hide();

代码在非 IE 浏览器下没有问题，即除了第一个含有 flipbox 类的元素外，其他的隐藏，但在 IE 里却全部隐藏了。

经过测试，除了上面的写法在 IE 下有问题外，下面的几种写法在 IE 下也有问题：

$('.flipbox:not(:first)');
$('.flipbox:not(:last)');
$('.flipbox:not(:even)');
$('.flipbox:not(:odd)');
$('.flipbox:not(:eq(1))');
$('.flipbox:not(:gt(1))');
$('.flipbox:not(:lt(1))');

很奇怪的是：如果把 className 换成 tagName，如上面把 .flipbox 换成对应的标签名，又不会出现问题。当然，换成标签名的话，你要确定不会选择到其他不需要选择的标签，以免产生混乱，出现其他问题。

阅读全文 >

查看：219 评论：2 标签：IE,jQuery

7月份全球主流浏览器市场份额

日期：2010-08-2 分类：浏览器

又过去了，浏览器经过一番“斗争”后，又出现了怎样的局面呢？根据市场研究公司 Net Market Share 最新发表的统计数据显示，微软 IE 浏览器依旧以 60.74% 的市场份额位列第一，并且份额连续连两个月上升。而排名第二的 Firefox 则连续三个月下滑，7 月的市场份额降到了 22.91%。第三名为 Chrome，为 7.61%，比上个月下降了 0.08%。Safari 则一路上升，连续 5 个月份额上升，虽然每次上升的份量不多。7 月 Safari 的市场份额为 5.09%。第四名是 Opera，只有 2.45%，但比上个月增加了 0.18%。

也就是说和上个月相比：

• IE +0.42%
• FF -0.90%
• CH -0.08%
• SA +0.24%
• OP +0.18%

从上面的数据可以看出总体的趋势是：Firefox 的份额被 IE 和 Safari 抢夺了。

IE 9 将月 9 月公测，其他浏览器也在不停的更新，浏览器的战争还在进行中，以后局面会怎样，我们静观其变吧。

查看：210 评论：2 标签：Firefox,IE

jQuery插件Flip

日期：2010-07-27 分类：未分类

Flip 是一个基于 jQuery 的插件，它模仿流行的卡片翻转的效果，可以轻易的让元素在左右上下四个方向翻转。先看看效果吧，查看 Demo

Flip 同时基于 jQuery UI ，所以，要使用 Flip 需要引入 jQuery 和 jQuery UI 。

Flip 使用很简单，只需让元素调用 flip 方法就可以了。

$('.flipbox').flip({})

不过，仅仅只是单纯的调用 flip 方法的话，很多属性是默认的，也许不一定符合你的要求，你可以根据自己的要求、喜好添加相应的属性，Flip 提供的全部属性有：

阅读全文 >

查看：430 评论：4 标签：jQuery,jQuery UI,jQuery插件