我马上去试了一下,还是不太满意: ppt大小是固定大小(728x562px), 广告位还是很多.

最后我还是bigfoot关掉了,继续使用这个小Bookmarklet.

javascript: (function() {
    var rz = function() {
        var h = $(window).width() * 3 / 6;
        h = h + "px";
        $(".player").css("min-width", "400px").css("width", "100%").css("height", h);
        $(".column1, .playerWrapper, .player, .slideDisplayer").css("width", "100%").css("height", h);
        $(".playerWrapper").attr('style', 'width: 100% !important');
        $("#player").attr('width', $(".player").width()).attr('height', $(".player").height())
    };
    $(".h-top-ad, .h-skyscraper-ad, .h-related-more-tab").css("display", "none");
    $(window).bind('resize', rz);
    rz();
})();
void 0

这是点击前和点击后的展示效果:

如果要把元素旋转度,CSS3的语法是:

transform:rotate(-3deg);

却要写这么多:

   -webkit-transform:rotate(-3deg); /*为Chrome/Safari*/
   -moz-transform:rotate(-3deg); /*为Firefox*/
   -ms-transform:rotate(-3deg); /*为IE*/
   -o-transform:rotate(-3deg); /*为Opera*/
   transform:rotate(-3deg); /*为nothing*/

真是够丑的,谁有好办法?

但是有些网站的广告放的也实在太多了点。比如我经常使用的dict.cn, 上、下、右，都放满了广告。一眼望去，我还真不知道，那些是单词解释，那些是挂的广告。于是还是打算把dict.cn的广告屏蔽一下。

在Firefox里有个Stylish插件，可以在本地修改网站的css。比如你在Stylish给dict.cn的”#ad_top”加个”display:none”，它就不会显示了在你的浏览器里了。但是碰到广告就去编辑一下对应的css，也挺麻烦的。

如果有人维护这样一个屏蔽大多数网站广告的css，我们只要像使用杀毒软件那样，装个软件，它就自动每天更新新的广告屏蔽css该多好。顺着这个思路，我找到的就是AdBlock for Chrome。AdBlock里的filter lists大概就是这个想法，而且有中文网站的filters可以选。我不清楚的是，这个filters是AdBlock自己维护的，还是用户贡献。如果是用户贡献的那就比较牛了，新出现的广告一出来，用户就能在第一时间贡献用于广告屏蔽的css。跟开源的只要眼睛多、bug就好捉的精神一样，只要用户贡献的广告屏蔽css，网站就干净的多。应该和人肉xxx算是一类。

不管怎样AdBlock for Chrome现在的filters已经不错了，至少它有我需要的dict.cn。

来比较一下使用AdBlock的效果。
使用AdBlock之前的dict.cn：

使用AdBlock之后的dict.cn：

AdBlock for Chrome下载地址，还有AdBlock的Firefox姊、Safari妹。

作者的主要想法是，通过把编辑器变成一个简单的脚步解释环境，来提高编码的效率。我想这也是VIM这种编辑器反而比一些的IDE效率更高的主要原因。不过Zen Coding的想法更新颖，代码更少。
例如我们要输入这样一段html代码，

<div id=”header”>
    <ul class=”navigation”>
        <li><a href=”"></a></li>
        <li><a href=”"></a></li>
        <li><a href=”"></a></li>
        <li><a href=”"></a></li>
    </ul>
</div>

以zen coding的方式，就只需要输入“div#header>ul.navigation>li*4>a”，然后按快捷键展开就好了。

心动了，来体验一下zen coding的魅力吧。这个在线的Zen Coding编辑器，是通过js，把普通的html textarea变成了不错的IDE。如何让你网站上的textarea也支持这个功能？试试这个吧。

我常用的代码编辑器是VIM和Eclispe，来看看怎么使它们支持Zen Coding吧。

首先来看看VIM

VIM下支持Zen Coding相对比较容易

• 首先确保你的VIM版本支持python的。我使用的是Debian/squeeze下的vim-nox包，squeeze下支持python的VIM包。
• 然后下载这两个VIM插件，zencoding.vim和zencoding_vim.py，拷贝到VIM的.vim/plugin目录中。
• 再从这里，下载Zen Coding for TextMate v0.3.1.zip，把压缩包里的zencoding整个目录拷贝到.vim/plugin下。注意是目录。

OK，现在可以打开VIM试试了。进入插入模式输入“div#header>ul.navigation>li*4>a”，然后按“Ctrl+E”，看看有什么效果，呵呵。
VIM下的Zen Coding的快捷键设置如下：

插入模式下Ctrl+L ：插入缩略代码
可视模式下Ctrl+L ：在选中的文本前后，重复插入缩略代码
插入模式下Ctrl+E：直接在当前编辑位置，运行并插入生产的代码
插入模式下Tab：同Ctrl+E

再说说Eclipse

Eclipse下支持Zen Coding实际上是通过js做的。就像在Firefox里有Greasemonkey这样的扩展是用户可以通过js来扩充Firefox；Eclipse下也有个类似的叫Eclipse Monkey的项目。

• 首先在Eclipse里添加这个更新站点http://download.eclipse.org/technology/dash/update，更新、安装Eclipse Monkey。
• 然后看这个演示，就知道怎么在项目里加入zen coding的js文件，来扩展Eclipse了。

Zen Coding现在是一个比较新的项目，有兴趣的可以多关心Zen Coding在Google code上的项目。

参考文档：

• http://code.google.com/p/zen-coding/issues/detail?id=16
• http://code.google.com/p/zen-coding/wiki/AptanaHowToEn