IT牛人博客聚合

很多人可能都知道了 CSS 的选择器浏览器在解析的时候是从右往左的，和你所熟悉的从左往右的规则是不同的。但是这是为什么呢？这么做的性能是否更高？

Related Items:

为什么排版引擎解析 CSS 选择器时一定要从右往左解析？

查看全文: http://www.udpwork.com/item/7135.html

【感谢 Neo 投递本文 – 微博帐号：_锟_ 】

前言： 布局是WEB开发一个重要的课题，进入XHTML/CSS后，使用TABLE布局的方式逐渐淡出，CSS布局以众多优点成为主流，本文将介绍40个基于CSS的web布局的资源和教程。文章的出处在http://www.noupe.com/css/css-layouts-40-tutorials-tips-demos-and-best-practices.html。文中的不少的例子在一本经典的CSS书籍《CCS: The Missing Manual, 2nd Edition》中都可以找到，据我所知，第二版在中国没有翻译出版。你可以从这里下载英文版（不过需要注册个用户名）

正文

查看全文: http://www.udpwork.com/item/7005.html

Phonegap相关

1. 隐藏顶部的状态栏

         在xxx-Info.plist中新增一项属性："Status bar is initially hidden" = YES；此外，还可以增加其他的属性，例如Launch image等。

2. 用户滑动Webview时，正常情况下会超出边界然后弹回来，也就是Bounce，可以通过以下方式禁止这种行为：

在AppDelegate.m中的webViewDidFinishLoad方法中添加：

    for (id subview in

查看全文: http://www.udpwork.com/item/6993.html

        去年曾对Phonegap做过一次调研，当时还是1.1版本，印象也一般。对他的性能以及真实的跨平台能力都不太确定。今年过完春节至今正好有机会参与了一个纯Phonegap + HTML5开发的项目，项目至今已经完成了一期的App Store提交，所以也正好能抽时间来小结一下。一个月左右的开发过程让我对这种开发模式有了更深的认识，这对于前端开发人员而言绝对是一个大的机会。Phonegap Native API + Plugin基本能访问移动设备绝大部分本地功能，除此之外就是HTML5了，迁移成本非常的低，而开发效率也是很高的。

  

查看全文: http://www.udpwork.com/item/6992.html

MarkNote 1.0.1在苹果应用商店上架了。这是一个在iPad上使用的Markdown编辑器，如果你喜欢用Markdown来写一些文字的话，那么这个应用可能就是一个不错的选择。

现在限时降价，6块

1.0.1新增的功能:

新增了多个语言支持

新增了全屏预览按钮

在键盘上新增了两个按钮: < 和 >

解决了第一次打开文件时有可能没有预览的问题

解决了Dropbox同步的一个问题

我借到一个支持Air Print的HP打印机测试了打印功能，MarkNote的打印功能工作正常。

图片预览

新增的全屏预览按键在下图的右下方，可惜被某浪的图片水印盖住了。

查看全文: http://www.udpwork.com/item/6972.html

开发WebApp时，遇到一个问题：

如果把页面配置到服务器上，当服务器挂掉或者用户离线的时候，那这个App也就没法工作了。

而当我把页面打包进App里面，又有一个新问题，更新不方便。每次更新的时候都要重新提交。

部门就此组织了一次《application cache》的相关讨论。使用离线存储，来解决上述问题：

view-source:http://uicss.cn/test/coolcode.html

这是一个打包进App的应用地址，阅读源代码可以看到，html标记上给了一个manifest配置文件。里面列出了需要高速缓存的、用于离线访问的文件。在支持mime类型为.manifest的服务器上，它能够列出浏览器应该下载和保

查看全文: http://www.udpwork.com/item/6959.html

最近看到了js1k网站上的比赛，突然很有兴趣参加一把，于是写了一个自己的作品Save Messed Up Love放了上去。

所有提交的作品必须用小于1024B的javascript实现，我花了一些精力用一些变态技巧优化用工具精简过的代码体积，成功将代码从原来的1271B减到988B，空出的代码让我有空间增加一些额外的功能。在这里给大家分享一下这些变态技巧，注意，千万不要在实际项目中使用。

首先介绍一些不变态的技巧，算是入门级的内容，其要点是时间换空间，这是与jslint的原则背道而驰的，把下面每个点都反过来看可能就是正确的编程方法了……

尽量使用with

javascript的with关键字是神器，详见下面的代码：

//

查看全文: http://www.udpwork.com/item/6903.html

RT! 菜汤要写活动策划，里面有一个小节目，我出的鬼主意，也用到了这个小网页作为工具。

一开始不知道用啥工具写比较好，我会点VB，但是又不能在Linux写。.Net先排除了，发布了还要别人安装框架，更麻烦。Python嘛，对它的图形处理还不是很熟悉，写起来也不怎么容易。选什么GUI库也是一个难题。

所以，最后选择了一窍不通HTML5。用网页写比较容易跨平台，所以我在Linux下写好，别人也可以用她的Win7来用了。HTML5的入门也不难，花了一个小时看了一篇教程，就开始写了（因为我只用到Canvas）。

我的第一个HTML5写的网页哦。

展示地址：

http://xiaoxia.org/upfiles/2012/02/in

查看全文: http://www.udpwork.com/item/6785.html

一、什么是 Placeholder ？

在 HTML5 的 input 标签中新增了一个 placeholder 属性，作用是在输入框中默认显示一些提示文字，以创造更好的用户体验。

使用方法：

<input type="text" placeholder="Username" />

查看 Demo

该特性仅被现代浏览器支持，在旧版 IE 下我们可以使用 javascript 来模拟实现。

二、Placeholder 的 js 实现

var doc = document,
inputs = doc.getElementsByTagName('input')

查看全文: http://www.udpwork.com/item/6947.html

下面是我这段时间来收集的一些有意思的东西。本站这样的文章还很多，如这个，这个，这个。

Javascript Garden，这是学习Javascript最好的网站了。http://bonsaiden.github.com/JavaScript-Garden，这个文档由两具StackOverflow的人写成, Ivo Wetzel(Writing) 和 Zhang Yi Jiang (Design)，表示敬意。

想看看Web开发有哪些技术吗？你得看看这个网站：http://stackparts.com/，他对目前几乎所有Web上用得到的技术都分了个类。下面是个抓图。

Mozilla的安全编程规范 https://wiki.mozi

查看全文: http://www.udpwork.com/item/6372.html

收家的时候发现了一张VC++6.0的光盘，实然引发了我的怀旧情结。于是在微博上感叹了一下，看到一些朋友的回应，还有朋友提到了Turbo C 2.0，于是更回放大了我的怀旧情绪，让我回想了很多N年前伴我走过编程之路的软件。现在看下来，有些感叹，又有些可笑。感叹的是技术发展的变迁，可笑的是当时的一些想法。（Unix/Linux是在大四和毕业的时候接触的，虽然这是我的强项，但是这下面的编程这么多年来没什么变化，所以就不提了）注：图片较多，请稍等。

还记得第一次接触编程是在高中的时候，用中华学习机学Basic程序，后来到了大学，虽然学校的课程没有教Basic语言，但是DOS下有一个叫Quick Baisc的东西让我把高中时的知识又捡了回了

查看全文: http://www.udpwork.com/item/6065.html

下面是近期收录的一些文章和资源，希望对你有用。

系统方面

印度的电子商务网站flipkart的性能扩展（PPT） http://www.slideshare.net/sids/how-flipkart-scales-php，都是一些最基本的东西，对于初学者来说很不错。PPT做的也不错。

Tagged.com的扩展之路 – 1亿用户，1000台服务器，50亿的PV http://highscalability.com/blog/2011/8/8/tagged-architecture-scaling-to-100-million-users-1000-server.html 还是PHP的WEB站点。另外，highsc

查看全文: http://www.udpwork.com/item/5924.html

又好久没写博客，我必须凑数做到每个月至少一篇，不然破坏了这几年的传统感觉不太好。

最近HTML5太热门了，在微博上老是看到HTML5又能干嘛干嘛，又做出什么炫酷效果了，然后又跟FLASH对比，FLASH必被淘汰，这种论调出现得太频繁了，感觉挺无聊。用炫酷效果来宣传HTML5实在不是明智之举，现在HTML5能做到的任何效果除了WEBGL的硬件加速其他的5年前的FLASH就已经能很好地做到，而且性能更好得多，随便搜一下FLASH酷站，看看里面的交互，哪个不比目前纯WEB的方式强，感觉WEB使人机交互退步了10年。当然FLASH的优势是交互和效果强，HTML的优势是对内容处理能力强，现在互联网全是内容，一切以服务内容为主，强的交互和设计

查看全文: http://www.udpwork.com/item/5919.html

桌面通知功能能够让浏览器即使是最小化状态也能将消息通知给用户。这和WebIM是最为天然的结合。不过，目前支持Desktop Notification功能的浏览器只有Chrome5+。

关于通知的基础知识可以参考以下文档：

W3C标准:http://dev.w3.org/2006/webapi/WebNotifications/publish/Notifications.html

使用教程:http://www.html5rocks.com/en/tutorials/notifications/quick/

本文主要记录通知功能在Web IM中实际使用时的一些经验。

在实际使用的过程中，应该尽量减少通知功能对用户的干扰，最大

查看全文: http://www.udpwork.com/item/5605.html

在实际上项目当中，经常需要使用短轮询(每隔一定时间就向服务器发送一次请求，请求通常会立即返回)和长轮询(每次请求服务器会Hold一段时间直到有新数据或者超时，客户端收到数据后会立即进行下一次请求）来从服务器拉取数据，然后动态的更新页面。随着功能的增加，一个页面中往往存在不止一个这样的轮询请求，而且在用户开启多个Tab页面时，总得请求数会翻倍。而“请求同步”指的是在以上场景中，即使是开启多个Tab也只有一个Tab页面维持轮询连接，一旦数据返回后，就将数据同步到其他无连接的页面，最大程度的减少请求。实现的思路也很简单，先解决由谁来进行请求的问题，之后基于本地存储将数据进行同步即可。具体的实现则有不少细节需要注意的，以下详细阐明。

一、

查看全文: http://www.udpwork.com/item/5591.html

本文介绍Tab之间的操作同步的实现，所谓操作同步是指将用户在某个Tab窗口中的操作同步到所有其他同一站点得Tab中。例如IM窗口的操作（打开、最大化、最小化、关闭、设置等），由于很多用户会在多个Tab之间切换，而IM在每个页面中都存在，因此对于数据同步的要求是比较高的，以前的做法是使用服务器方式来同步，即所有操作都向服务器发请求，然后广播，Tab收到消息后再响应。缺点是比较浪费资源，另外延时也比较严重。

实现

在具体的实现上，只是给封装的Storage添加了一个sync接口，格式如下：

/*
跨页面同步指定的函数
@param {function} func 需要同步执行的函数(不允许重名，函数参数必须为string类型

查看全文: http://www.udpwork.com/item/5589.html