关于CSS3中user-select属性的作用

2012年2月1日 由 gongyy999 没有评论 »

不知不觉又是好几个月没写博文了。最近在开发一个C/S的软件。说是C/S其实也不全是C/S结构,其中也套了不少的WEB页面,其实也就是一个桌面程序了。 最近程序内嵌了webkit内核,所以在开始过程中,我可以大胆的应用各种HTML5和CSS3的新技术。脱离了对各种浏览器的支持,对于一个前端工作者来说,真的是一大福音啊。 今天就简单的写个关于css3中user-select这个属性。 这个属性是CSS3中新增的一个功能,用来控制内容的可选性。 用法: user-select:值; 值: auto——默认值,用户可以选中元素中的内容 none——用户不能选择元素中的任何内容 text——用户可以选择元素中的文本 element——文本可选,但仅限元素的边界内(只有IE和FF支持) all——在编辑器内,如果双击/上下文点击发生在子元素上,改值的最高级祖先元素将被选中。 -moz-none——firefox私有,元素和子元素的文本将不可选,但是,子元素可以通过text重设回可选。 实例: .demo{ border:1px solid #ccc; background:#f5f5f5; padding:10px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; } 提示:你可以先修改部分代码再运行。 效果(试着选中下面的文字): 试着选中这里的文字看看! 目前,只有Gecko和webkit支持该属性,包括基本上所有版本的Firefox/Chrome/Safari,IE10中也将支持该属性。当然,各个浏览器都必须加上私有前缀。Opera尚不支持。 不过在firefox下的解释似乎和webkit的解释有点区别,试着复制“效果”到“目前”之间的内容可以发现,中间不被允许选中的内容在webkit下是会被复制的,但在firefox下就不会。对于可选性这点,似乎webkit更贴切点。

wordpress手机客户端

2011年11月14日 由 gongyy999 2 条评论 »

无意中看到WordPress的手机客户端,通过手机,用URL和帐号登录后就可以通过手机了解博客的最新情况

JavaScript本地存储实践(html5的localStorage和ie的userData)

2011年6月20日 由 gongyy999 1条评论 »

本地存储解决方案很多,比如Flash SharedObject、Google Gears、Cookie、DOM Storage、User Data、window.name、Silverlight、Open Database等。 借用网上的一张图来看下目前主流的本地存储方案: Cookie: 在web中得到广泛应用,但局限性非常明显,容量太小,有些站点会因为出于安全的考虑而禁用cookie,cookie没有想象中的那么安全,Cookie 的内容会随着页面请求一并发往服务器。 Flash SharedObject: 使用的是kissy的store模块来调用Flash SharedObject。Flash SharedObject的优点是容量适中,基本上不存在兼容性问题,缺点是要在页面中引入特定的swf和js文件,增加额外负担,处理繁琐;还是有部分机子没有flash运行环境。 Google Gears: Google的离线方案,已经停止更新,官方推荐使用html5的localStorage方案。 User Data: 是微软为IE专门在系统中开辟的一块存储空间,所以说只支持Windows+IE的组合,实际测试在2000(IE5.5)、XP(IE6、IE7),Vista(IE7)下都是可以正常使用的。在XP下,一般位于C:\Documents and Settings\用户名\UserData,有些时候会在C:\Documents and Settings\用户名\Application Data\Microsoft\Internet Explorer\UserData。在Vista下,位于C:\Users\用户名\AppData\Roaming\Microsoft\Internet Explorer\UserData;单个文件的大小限制是128KB,一个域名下总共可以保存1024KB的文件,文件个数应该没有限制。在受限站点里这两个值分别是64KB和640KB,所以如果考虑到各种情况的话,单个文件最好能控制64KB以下。 localStorage: 相对于上述本地存储方案,localStorage有自身的优点:容量大、易用、强大、原生支持;缺点是兼容性差些(chrome, safari, firefox,IE 9,IE8都支持 localStorage,主要是IE8以下版本不支持)、安全性也差些(所以请勿使用localStorage保存敏感信息)。 主要说说localStorage和UserData: UserData 基本语法 :XML: <Prefix: CustomTag id=sID style=”behavior:url(‘#default#userData’)” />HTML: <ELEMENT style=”behavior:url(‘#default#userData’)” id=sID> Script:object.style.behavior = “url(‘#default#userData’)”object.addBehavior (“#default#userData”) 属性:expires 设置或者获取 userData behavior 保存数据的失效日期。XMLDocument [...]

HTML5表单的Input类型及HTML5表单的新属性

2011年4月6日 由 gongyy999 3 条评论 »

表单是电子商务网站中最常见的页面,包括注册账户、产生购买行为,是人机交互的最基本的技术。随着web等技术的一步一步发展,更加注重设计的人性化和友好性。所以为了提高编程人员的效率html5出现了,其中html5的表单就是很抢眼的一部分,虽说现在大部分浏览器对html5的支持不是非常好,但这必然是一种趋势,所以网站技术人员必须跟上发展,对新的事物要积极学习。希望小东北的这篇文章对你的进步会有所帮助:) HTML5 新的 Input 类型 HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。 本章全面介绍这些新的输入类型: email url number range Date pickers (date, month, week, time, datetime, datetime-local) search color 浏览器支持 Input type IE Firefox Opera Chrome Safari email No No 9.0 No No url No No 9.0 No No number No No 9.0 No No range No No 9.0 4.0 4.0 Date [...]

选择联动效果(无限级)

2011年3月17日 由 gongyy999 没有评论 »

因公司项目需要一个全国地址联动的效果,就写了一个选择联动的JQUERY插件,支持任何JSON格式,无限级。 参数说明: data:联动数据,结构为JSON,可无限级 return_dom:用于存放选择结果数据的容器,能过class获得 set:初始设置,例set:”12.964″为初始一级菜单值为12,二级菜单值为964。如其中某一级未找到子级元属,则不会有下级值。 name:初始值,在未设置初始值或初始值参数错误的状态下起作用。 查看DEMO 下载

日本9.0级地震

2011年3月15日 由 gongyy999 没有评论 »

这次小日本可够惨的了,9.0的地震。史上最强啊,发现这几年强震不断,实在是可怕。 强震后来了海啸。这也是一大灾啊,想想04年的印尼海啸,几十万条生命离开了人世。在大自然的面前,生命也够脆弱的了。中国长久以前受着人定胜天的思想,不知道经历过汶川地震,玉树地震,看过印尼海啸和这次日本的天灾后会不会有所改变。 海啸后,又来了核泄露。竟然到了申请国际援助了。看来,形势非常严峻啊。要是来个 切尔诺贝利核第二,那小日本可真就小日本了。 虽然对日本有着很深的民族仇恨,但细化到个人也没什么深仇大恨,看着日本着这天灾人祸的,心里也有些许同情。 愿日本早日搞定核问题,然后重建家园!

Zen Coding: HTML/CSS代码快速编写插件

2011年1月28日 由 gongyy999 1条评论 »

前来发现一个非常有趣的东西——Zen Coding,非常适合搞HTML/CSS的朋友们

它无视了编辑器的自动提示和自动完成,秒杀了你自定义的各种快捷键或者 AHK 的热字符串,以智能简洁高效的缩短输入,带给你超快速地书写各种复杂而枯燥的 HTML 和 CSS 代码的体验。

Zen Coding 就是这样牛叉的东西,Zen Coding 分为 Zen HTML 和 Zen CSS 两部分。这两部分功能是以插件的形式来实现的。如果你用 NetBeans、SlickEdit、Sublime、TextMate、TopStyle、UltraEdit、Notepad、 Dreamweaver、Aptana 都可以在官方下载页面找到相关的插件。

细说产品魅力属性

2011年1月28日 由 gongyy999 1条评论 »

本文由胡斐撰写,源地址是:http://www.panghufei.com/?p=10351

“魅力属性”是一个常常被我用在产品设计和产品体验上的词汇。
这不是我发明的,我在上一家公司A.O.Smith热水器的时候,做了一段时间用户调研,我们的调研公司使用了一个叫“科诺(Kano)模型”的东西帮助我们分析产品的各种属性,有关产品几种属性的内容我记下来了。很长时间以来,我发现这样的概念完全可以用在我们的互联网产品设计上,甚至在很多产品设计上都可以套用,还很管用。
于是我在很多场合开始讲这个概念,结合我的一些经验和理解,有一些优化吧。很多人也对这个开始很感兴趣,弄得好像是我提出来的东西一样。我在这里试图详细阐述一下吧。

在UCD年会上我分享了所谓的产品“四种属性”,当时的解释是,所有产品的属性可以分为四类,他们是:
必备属性 产品必须具备的属性。比如电视机必须能出影,比如微博必须能发布能关注,满足用户对产品最基本的需求。

可有可无属性 用户认为是产品无所谓的属性,比如电冰箱可以放音乐。

魅力属性 用户认为产品特别有吸引力的,区别于其他产品的特别属性。

不可接受属性 产品不可以具备的属性,也往往和必备属性相对立。比如在中国使用110伏电源,微博不能转发等等。

其实这是被我简化和概念化了的模型,关于这个的原始资料和相关分析方法,我们在文章后面会附上,相信对做用户和产品研究的同学会有帮助。
其他三个概念都非常好理解,唯独“魅力属性”,需要详细说说,这也是我认为最有价值的属性。更是所有产品经理在设计产品时需要考虑的东西。这东西,没有没所谓,有了,还真丢不掉。

MySQL的数据分区

2010年10月19日 由 gongyy999 1条评论 »

MySQL的数据分区,对付千万级表应该会起到一定的作用。不像单纯的数据分表,需要重写程序。分区后不影响程序的运行。是个优化数据库的不错的选择。

Zakas解答Baranovskiy的JavaScript小测试

2010年7月26日 由 gongyy999 没有评论 »

Zakas 1/22在twitter上分享了Baranovskiy的一篇文章“So, you think you know JavaScript?”(你认为你够了解javascript吗)标题很叫板。结果5小段代码做的稀里哗啦。
今天Zakas专门撰文解答了这几道题(http://www.nczonline.net/blog/2010/01/26/answering-baranovskiys-javascript-quiz/)。不愧是大师,很深刻。
……