摘要: 特别声明:此篇文章由David根据Charles Morris的英文文章原名《Adapting your WebKit-optimized site for Internet Explorer 10》进行翻译,整个译文带有我们自己的理解与思想,如果译得不好或不对之处还请同行朋友指点。英文出处:http://blogs.windows.com/windows_phone/b/wpdev/archive/2012/11/15/adapting-your-webkit-optimized-site-for-internet-explorer-10.aspx中文译文:http://www.w3cplu 阅读全文
posted @ 2014-01-08 23:34 白树 阅读(1651) 评论(0) 推荐(0) 编辑
摘要: 国外一篇文章,有点意思,转载过来,准备尝试下~中文地址:http://www.cnblogs.com/rubylouvre/p/3471490.html原文地址:http://blog.teamtreehouse.com/increase-your-sites-performance-with-hardware-accelerated-css你知道我们可以在浏览器中用css开启硬件加速,使GPU (Graphics Processing Unit) 发挥功能,从而提升性能吗?现在大多数电脑的显卡都支持硬件加速。鉴于此,我们可以发挥GPU的力量,从而使我们的网站或应用表现的更为流畅。在桌面端和移 阅读全文
posted @ 2014-01-08 09:29 白树 阅读(31507) 评论(8) 推荐(2) 编辑
摘要: 微信 Android 5.1 和 iPhone 5.1 已正式发布了,据说本12月底,微信将推出 Winphone 5.0版本,全面支持微信支付,它绑定 IE10 浏览器,那么做微信公众号的 H5 页面,除了做好 webkit 兼容外,IE10 的兼容也是必不可少的。曾经写过《常见CSS3属性对ios&android&winphone的支持》一文,当时写过对Windows Phone 7 和Windows Phone 8的对应的浏览器分别是IE9和IE10做好兼容,但由于产品的特性对 Winphone 支持不友好,项目组也没有对 IE9 和 IE10 进行特别的处理,现在微信支 阅读全文
posted @ 2013-12-30 17:32 白树 阅读(3845) 评论(4) 推荐(3) 编辑
摘要: 接近年底了,又到产品们赶KPI的时间,开发也跟着辛苦,于是连续加班了4个星期,项目总算有点起色,也终于挤出点时间,写篇文章,just for fun ~高清显示屏原理,之前在团队内做过的一个类似的分享,因为上次有园友问了我手机端css sprite的设计原理,不知道手机端的图片为什么是用2倍大,背景... 阅读全文
posted @ 2013-11-26 14:36 白树 阅读(17533) 评论(35) 推荐(22) 编辑
摘要: 做前端开发难免要使用IE6,相信很多朋友知道win7上是不支持安装IE6的,通常会使用IETester,要么在win7中安装虚拟机,在虚拟机中安装IE6。分析下这2种方式:IETester:并不是真正的IE6,使用起来不稳定,经常会出现奔溃,有些公司内网的环境下使用代理脚本上网导致IETester也... 阅读全文
posted @ 2013-11-07 15:02 白树 阅读(6068) 评论(19) 推荐(4) 编辑
摘要: 上周,我参加了公司的一门课程《网站性能优化》,讲师提出了一个问题:一张图片优化后减少5K,1年内可以大概省下多少宽带成本呢?非常好奇,仔细听完讲师分析,计算出来的数据让小伙伴们都惊呆了,仅仅5K,看起来真的没什么,一年内大概节省540元~1440元,这说明一个问题,用户数庞大的网站中,一点优化可能会带来巨大的带宽成本节省,表现出价值是特别高的,不容忽视小小优化带来的意义。相信很多同学也好奇这个数据是怎么计算的,公司的内部数据不好透露,给大家重新举个例子:这个例子只是图片的优化,对于实际工作中,还有很多节省宽带成本的方法,如果要去算,那这个影响会放大10倍,100倍甚至是1000倍以上的数量级。 阅读全文
posted @ 2013-11-01 13:45 白树 阅读(6796) 评论(34) 推荐(11) 编辑
摘要: 干货来了,在于提升用户体验,非常实用,做webapp的童鞋不要错过~本文由99根据Kyle Peatt的《A Beginner's Guide to Perceived Performance: 4 Ways to Make Your Mobile Site Feel Like a Native App》所译英文出处:http://www.mobify.com/blog/beginners-guide-to-perceived-performance/中文译文:http://www.w3cplus.com/performance/beginners-guide-to-perceived 阅读全文
posted @ 2013-10-28 23:24 白树 阅读(2645) 评论(4) 推荐(3) 编辑
摘要: 本文是zawa同事写的一篇博文,相信很多在webapp开发中的同学使用iscroll4会遇到的该问题,问过zawa兄的建议,在这里分享给大家,希望能帮助到各位~原文地址:http://www.zawaliang.com/2013/10/443.html问题:在使用了iScroll4的容器内,当表单元素focus聚焦后键盘出现时,可能会存在iScroll区域高度不更新,滚动异常问题;而且当前聚焦的表单元素可能不出现在可视区域内,影响用户体验。iKeyboardScroll4就是这么一个解决方案Github见:https://github.com/zawaliang/iKeyboardScroll 阅读全文
posted @ 2013-10-25 14:49 白树 阅读(3640) 评论(2) 推荐(0) 编辑
摘要: 联网web前端设计行业通过一段时期的茧封或焰炼,web技术使行业、企业及自身发生质的改变。痛苦的蜕变是成长的契机,在彼此互相冲击、交流、融合的对话下,将以尊重包容互助合作同步发展的心态,对行业蜕变、自我提升的过程分享自己的观点进行探讨。2013,本届主题为“蜕变”的前端技术年度交流会已是第七届,依然如往年在深圳、广州、上海、北京、成都五地举行,腾讯ecd联合WebRebuild.ORG、深圳大学文化产业研究院、迅雷CUED主办了第七届前端年度交流会“蜕变”首站 - 深圳站,将于10月26日上午9点在深圳大学拉开帷幕。交流会形式web前端设计主题分享、现场来宾主题交流对话探讨。会议进行时间201 阅读全文
posted @ 2013-10-16 17:32 白树 阅读(1159) 评论(0) 推荐(0) 编辑
摘要: 两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低。很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能会更大。成长以来,很多朋友也听说到不少激励自己上进的话,但不是每个人都能一直坚持做下来,其实,这个跟 阅读全文
posted @ 2013-09-18 14:15 白树 阅读(288912) 评论(65) 推荐(37) 编辑
摘要: 说到两端对齐,大家并不陌生,在word、powerpoint、outlook等界面导航处,其实都有一个两端对齐(分散对齐)的按钮,平时使用的也不多,我们更习惯与左对齐、居中对齐、右对齐的方式来对齐页面的文本或模块。 响应式网页设计出现以来,更多是使用百分比布自适应布局,特别是在移动端,两端对齐的方式 阅读全文
posted @ 2013-08-30 09:42 白树 阅读(250512) 评论(14) 推荐(20) 编辑
摘要: 2个月前,我在博文《webapp开发中兼容Android4.0以下版本的css hack》中写过“那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了”,在这里纠正下,在目前Wepapp开发中,主要对webkit内核的手机做好各个版本的兼容已经不够了,像其它的高端智能手... 阅读全文
posted @ 2013-08-03 13:56 白树 阅读(17421) 评论(0) 推荐(2) 编辑
摘要: 上周10号,一大早来公司收到系统发送来邮件:【入职2周年贺电】感谢有你,共创未来。回头想想从大四来公司实习到现在已经有2年多了,时间过得飞快,在一个地方待久了,产生了感情,收到一封关心的邮件感触多多,这里感谢一直关心我成长的鬼哥和我的师傅jill,谢谢你们在一路上的指引,让我少走了弯路,也让我成长的更快。当然还有页面重构团队的兄弟姐妹们支持,一句话:感谢大家~不多说了,今天主要帮leader带来一枚招聘信息。关于财付通页面重构职位财付通是个很不错的地方,健康舒适的工作环境,优秀的童鞋,福利当然也丰厚。重点是重构组leader鬼哥在工作上和生活上都很关心大家,团队氛围真心不错,跟他混是很不错的选 阅读全文
posted @ 2013-07-16 16:13 白树 阅读(1453) 评论(8) 推荐(0) 编辑
摘要: 合理利用辅助工具可大幅度提高工作效率,今天给大家分享个人开发中比较实用的工具(软件和小插件),适合各种开发、设计等童鞋使用,非常好用,come on,来看看有没有你想要的工具吧!温馨提示:如果大家有好用的工具推荐,请回复留言,互相帮忙,共同进步~Xplorer2 -让双窗口垂直分割或横行分割,强大的快捷键,一键新建文件夹,分割文件,合并文件简介:http://baike.baidu.com/view/657744.htm下载地址:http://files.cnblogs.com/PeunZhang/xplorer2.rarBeyond Compare - 对比各种格式文件的工具简介:http: 阅读全文
posted @ 2013-07-04 18:18 白树 阅读(4130) 评论(9) 推荐(2) 编辑
摘要: 话说现在的手机型号越来越多,主要还是android和ios这2个巨头称霸了江湖,而他们自带的浏览器内核是webkit,那对于做移动网页开发的同事来说,一般只要做好webkit内核浏览器的展现效果就行了,看起来很简单,其实背后还有一个大坑等着你。虽说是webkit内核,但页面的展现效果还会受到自身系统的影响,升级后的系统打了补丁,新增了新的属性,支持更多丰富炫丽的效果,那么旧的系统(未升级的)就不支持一些新的属性,开发哥哥就是没有做好低端版本兼容的话,就会产生所谓的bug的,再加上android和ios系统各个版本也会带私有属性或者少带某个属性,于是坑爹的东西就这样产生,各种奇葩的bug,仿佛又 阅读全文
posted @ 2013-06-26 15:39 白树 阅读(10597) 评论(3) 推荐(0) 编辑
摘要: 用ZenCoding这么久了,总结下常用CSS3的写法,方便以后查找: PropertyAlias@media print {}@mbox-sizing:border-box;bxz:bbbox-shadow:;bxsh-webkit-box-shadow:0 0 0 #000;bxsh:wborder-radius:;bdrsbackground-size:;bgzbackground-size:auto;bgz:acontent:;cttext-shadow:0 0 0 #000;tsh+ 阅读全文
posted @ 2013-06-20 15:14 白树 阅读(1228) 评论(4) 推荐(0) 编辑
摘要: 一直折腾position:fixed在ios和android的使用,而事实上这么上流的ios4系统居然不支持position:fixed,幸运的是苹果公司在ios5系统修复了这个bug,比较理想的解决方案是让所有用户把系统升级到ios5及以上版本,这种想法在国外还好,在国内环境下,因为越狱而不想去升级手机的人很多,如果强迫用户去升级,那可能会把你的产品KS了。而你也不可能跟你老板说ios4什么不兼容那个属性啊,让用户升级啊!老板看到的是结果,你做不出来,别人怎么做得出来呢,这样你老板可能会对你的能力感到怀疑,或者认为你并不专业......那其实回到头来我们还是乖乖去做好兼容,要么就找到完美的解 阅读全文
posted @ 2013-06-14 15:21 白树 阅读(18972) 评论(8) 推荐(4) 编辑
摘要: Png是图像文件存储格式,在网页设计中已经不是一个陌生的名词,在前端开发中经常使用到它,如常用CSS 雪碧图。而Png的使用不仅仅如此,Png有多少种格式,有哪些特点,PC端中常用的Png格式是哪些,手机端最合适的Png格式是什么呢?如果你对这些问题有疑问,那么很开心的告诉你,这里有你需要的答案(*... 阅读全文
posted @ 2013-05-30 17:54 白树 阅读(14934) 评论(40) 推荐(17) 编辑
摘要: 在手机webkit浏览器中,用户在某一些按钮上长按3秒钟后,会弹出一个系统的列表,ios和android各自展现不一样,列表可以有复制或在在新窗口打开的等操作,这种体验对于按钮来说是不需要的,按钮上是绑定事件,有特殊功能,而这里系统把它当做一个链接的意义。查看了代码,原来是一个a标签,链接地址为空。<a href="#" class="btn">查看余额</a>找了资料后,ios平台有个解决办法可以通过控制当前元素的-webkit-touch-callout的样式属性为none;属性来禁止触发系统的菜单a{-webkit-touc 阅读全文
posted @ 2013-04-28 11:49 白树 阅读(4252) 评论(2) 推荐(2) 编辑
摘要: 大概是上个月,使用YUI压缩一个css文件后,发现只要是被压缩后的css文件有部分根本无法工作,一直都不知啥问题引起的,让我感到头疼。今天发现了只要是在媒体查询中的样式无法起作用,于是才开始怀疑是media被压缩后引起的bug,对YUI压缩不得不产生成疑问后来谷歌了:果然是YUI引起的bug:上面的图片解释为:如果电脑的YUI compressor还是旧的版本,压缩中,YUI compressor将media中的and后面重要的空格给删除了,导致media queries失效。后来我查看了电脑的YUI版本,我擦,居然是2009年8月份,严重out了- - 亲!要与时俱进啊!下载个最新版本后终于 阅读全文
posted @ 2013-04-18 18:53 白树 阅读(1743) 评论(1) 推荐(4) 编辑