2008 Sep 9

jQuery webPrejudice Plugin

Description

I believe most developers have been experiencing compatiblity issues with so-called brwosers. I know you have spent lots of time fixing pages to grace all browsers. So have I. I feel distressed, exhausted when finishing tweaking. The last words I want to voice out —- I hate this!
Why not ask visitors to change another browser?! This plugin is set to list pros and cons of various browsers and recommend visitors to alter their browser!

描述

相信大多数开发人员都遇到过浏览器兼容性问题。你一定花费了大量的时间调试页面以便让大多数浏览器都能正常显示你的页面。我也如此!我觉得不爽,而且很累。我最后想说的是——我恨死这种工作了!
为什么不能让劝说浏览者换个浏览器呢?!这个插件就是用来干这个的,它会自动判断浏览者的浏览器,并且列出其他浏览器的优缺点,推荐浏览者使用某个其他的浏览器。

Read More

2008 Sep 5

Microformats, too early or too silly?

<div id="hcalendar-Wrote-a-Letter-about-Microformat" class="vevent">
<a href="http://pagetalks.com/" class="url"><abbr title="2008-09-05T18:47+08:0000" class="dtstart">September 5, 2008 6:47</abbr> – <abbr title="2008-09-05T19:10+08:00" class="dtend">7:10pm</abbr> : <span class="summary">Wrote a Letter about Microformat</span> at <span class="location">Workshop</span></a>
<div class="description">Seeing too much disscusion about microformat and I wrote some words about microformat. </div>
<div class="tags">Tags: <a href="http://eventful.com/events/tags/mircroformat" rel="tag">mircroformat</a><a href="http://eventful.com/events/tags/xhtml" rel="tag"> xhtml</a><a href="http://eventful.com/events/tags/xml" rel="tag"> xml</a></div>

深奥?看仔细点……这简直就是顾弄玄虚啊!不就是XHTML加了一群Class标签么?非也,此乃Microformat……

秉承以人为本,机器为其次的理念,微格式是一套构建于已经广泛接受的标准之上的,简洁、开发的数据格式。

Designed for humans first and machines second, microformats are a set of simple, open data formats built upon existing and widely adopted standards.

官方是如此定义的。如今Microformat已经成为了标准之一,可它就像众多其它标准一样,不为人知。尽管Microformat的技术仅仅是通过定义一套合法、合理的Class属性来进一步“格式化”HTML文档,但如今并没有并广泛使用。除了Yahoo、微软、Goolge的诸多服务中已经应用此项技术,众多网站还未加入这一行列。
Read More

2008 Sep 2

Google Set Off its Comat in Explorer Market

更新 今天我下载试用了这个软件.大多数站点都能够正常、快速浏览(看下面的那张Chrome的内存统计页面,竟然会显示自己跟其他浏览器对比,这个数据是都只打开PageTalks页面取得的。FF其实已经加入了很多插件了,这个对比显然不公平). 并且,你可以在这个浏览器中整合你想要的网络应用程序,或者创建到网络应用的快捷方式. 有人说这不仅仅是对IE8的一种挑战,而且是对MS本身的一次挑战,因为Google Chrome表演的角色是在云计算时代的一个操作平台,绝非单纯的网页浏览器.

Google要做浏览器了!疯掉了,这个世界疯掉了!这个场景让我们回到之前传言Google要开发手机一样……不过事实表明,只有我们想不到的,没有Google做不到的。事实上英文版的Google Chrome已经在今天发布了。
 

从界面来看,我们设计了一个简单而高效的浏览器窗口。对大多数人来说,浏览器本身并不重要,它只是一个能够运行互联网网页、网站和网络应用等重要程序的工具。正如谷歌的经典主页,谷歌浏览器延续了简洁、快速的设计理念,帮助用户快速准确地到达目的地。
从根本上讲,我们提供了一个能更好地支持各种复杂网络应用的浏览器基础平台。通过让每一个标签相互独立开来,从而避免了两个标签页产生冲突的可能,同时面对来自恶意网站的攻击,谷歌浏览器提供了更好的保护。我们提高了浏览器整体上的速度和响应度。我们还建立了一个更强大的 JavaScript 引擎 V8,以便为下一代网络应用技术提供支持,这些网络应用在目前的浏览器上几乎不可能实现。

Google的官方如是说,对广大用户来说,算是又多了一个简洁、快速的浏览器。(相信会和Google服务无缝链接)
对于开发者来说,JS V8的支持是一个亮点(不过现在JS V8过于前沿?)。必须注意的是,Google Chrome是基于Webkit的浏览器,我们能够大胆猜测,在Safari下能够测试通过的网页,在Google Chrome也应该没问题,希望……
Google有特地强调安全机制方面问题,我不知道会不会造成脚本和各种嵌入元素的安全特性造成改变。种种猜测,希望在正式版发布之后给我们一个答复吧!
更多消息请到Google 黑板报,以及Google的官方宣传漫画

Update I test Google Chrome today. Most sites are displayed properly in this browser. (See the picture below. It’s a system page in Chrome where shows the clear comparision to other browsers on memory usage. System gets date when I only open PageTalks in FF and Chrome, which is apparently unfair as FF has lots of plugin enabled……) Most importantly, it’s fast and combined with quick links to any web service. You can custom shortcuts to your favorite web applications. And a auto type checking. Others say that it’s not only a challenge to IE8 but it’s totally a challenge to MS, as it’s supposed to be a new operation platform in Cloud Computing era.

Google is beginning to develop its own brwoser. Crazy, huh? This remind us of the familiar situation when rumor saying that Google was creating its own cell-phone. It turns out that there is nothing Google can’t create, just something you can’t imagine. In fact, Google has released a Google Chrome beta today.
 

On the surface, we designed a browser window that is streamlined and simple. To most people, it isn’t the browser that matters. It’s only a tool to run the important stuff — the pages, sites and applications that make up the web. Like the classic Google homepage, Google Chrome is clean and fast. It gets out of your way and gets you where you want to go.
Under the hood, we were able to build the foundation of a browser that runs today’s complex web applications much better. By keeping each tab in an isolated “sandbox”, we were able to prevent one tab from crashing another and provide improved protection from rogue sites. We improved speed and responsiveness across the board. We also built a more powerful JavaScript engine, V8, to power the next generation of web applications that aren’t even possible in today’s browsers.

As Google explains, for most end-users, they have one more choice of brower which is undoubtly clear, fast. (We believe that all Google Service will connect to Google Chrome seamlessly).
For all developers, JS V8 is not a highlight ( but a little remote application?) We should note that Google Chrome is based on Webkit. Therefore we can predict that the websites working well in Safari will act perfectly in Google Chrome as well. (Hopefully). Google has emphasized on the security issues, which makes me thinking whether this means a lot some changes the way scripts and embedded elements work.Hope we will get answers in the finnal release.
For more info refer to Official Google Blog: A fresh take on the browser and an offcial comics.

2008 Aug 30

10 Top CSS hacks

浏览器兼容性永远是前台人员的痛。据统计,超过40%的时间都花在了兼容性问题上。Microsoft的固执,让开发人员编写一套完美的CSS是那么的痛苦。知道一些CSS hacks总是好的……

垂直对齐

目前CSS难以实现的一项功能是旧式垂直居中。也许CSS3的到来可以解决这个问题,不过我相信在长期一段时间内IE是不可能支持CSS3的。目前有两种方法解决垂直对齐的方法。
第一种办法就是用一个DIV来做“垫底”,把装载内容的DIV推到水平的中央。下面的示例中,ID为wrap的DIV内为主要内容,ID为shim的DIV是“垫底”的……

Cross-browser issues are always nightmares to developers. Accroding to cencus, more than 40 percents of time comsumed is spent on compitablilty preblems. The ego of Microsoft has made it painful to compose a perfect CSS for all browers. Therefore, you better know some Css hacks.

Vertical align div

It’s hard to vertical align the DIV in the current CSS. CSS3 might solve proble, but CSS3 is a remote hope. There are two ways to make it.
The first one is to use a DIV as the supporter, pulling the content DIV to the vertical-center. As in the example, the DIV with ID wrap is main content, while the DIV with ID shim acts as Supporter.

Read More

2008 Aug 29

jQuery imgDesc Plugin

描述

在开发PageTalks的时候顺便写了一个给图片加注释说明的插件。当然由于PageTalks的整个脚本都是基于jQuery的,所以这个插件也就是基于jQuery的了。先看一个演示吧:

需求

  • jQuery 脚本库, 你需要自行到jQuery的官方站点下载该文件
  • imgDesc的脚本文件(废话……)
  • 一点点JS和XHMTL的动手能力

功能

该插件能够将IMG标签的Title属性自动当作图片说明,并放置到底部显示。如果IMG外面没有A标签,这个插件会将IMG包装成链接,并转移标签属性。插件目前支持如下选项,均为可选参数:

  • autohide 是否自动隐藏底部注释,如果选择”yes”则会隐藏注释,鼠标掠过时会渐现出来。默认是“yes”
  • text 自定义注释文本,默认状态是IMG标签的Title属性值

Description

This plugin is written with the develpment of PageTalks, accidently. As PageTalks is based on jQuery Libary, jQuery code is required. Let’s start with a demostration:

Requirements

  • jQuery Libary, just downlaod fromjQuery Offical Site
  • imgDesc script file(oops……)
  • a little knowledge on xhtml and js

Features

This plugin will automatically take title attribute in IMG tag as the description of the image. If IMG is not wrapped by a Anchor tag, the plugin will wrap it with one. This plugin currently support two parameters, all of which are optional.

  • autohide if the plugin should automatically hide the description and show it when mouseover. Default “yes”
  • text Customize the value of description. Default value is the title attribut of IMG tag

Read More

2008 Aug 29

Let Thickbox conquers Flash

大家都知道我们无所不能的Thickbox竟然不能支持Flash的载入。虽然将SWF文件当作iFrame内容直接用Anchor引用,可以在 IE下正常显示flash内容,可惜在FF下无用。在Thickbox还没有做出更新的时候,我们该怎么在Thickbox里面显示Flash呢?曾经有 人提出过改版的Thickbox, 可以他没有继续更新。

今天突发奇想,干脆写个PHP页面,然后当iFrame引用吧!

我这里示范一下用Thickbox打开FLV播放器并播放指定文件的例子吧。(其实这个ELFVision里已经得到了使用)
这里使用的JW FLV播放器支持N多的参数和外部脚本,我们只订制了它播放文件、长度、宽度和自动播放,这四个非常基本的参数。如下是默认状态下的播放器代码:

<embed src="http://www.jeroenwijering.com/embed/player.swf" allowscriptaccess="always" allowfullscreen="true" flashvars="width=320&height=250&file=/upload/player.flv" width="320" height="250"></embed> 

Read More

Page 10 of 13« First...89101112...Last »