iOS

CSS zoom 在iOS8中失效

前些日子,偶然发现zoom在iPhone6里没有起作用,而这之前,iOS7以下的Safari则确实支持zoom。可惜我并没有iPhone来测试这个问题,毕竟自己还在用着老诺的10年前的手机,手中也只有老婆淘汰下来的iTouch4,所以无法比较准确地做过多描述,只能粗糙地得到一个大概的结论。 虽然zoom的初衷是放大和缩小内容,但早期常用于触发IE内部haslayout属性,用做IE6-7的药方。作为一个早期IE的私有属性,其实现在的大部分浏览器也都能支持,故而也就有人使用其完成一些网页功能,比如移动端的网页内容的大小适配——相比对各个元素指定尺寸,一个zoom就能搞定绝对是懒惰开发者的福音。 说实在的,zoom在某些方面堪称实用,原因是CSS Transforms在内容占位上的效果可能非人所愿。用CSS Transforms替代zoom并非不可以,只是还需要关注缩放前后的位置大小,远没有zoom方便。而就是这么一个用法便利的尚未正名的属性,在最新的iPhone6面前不举了...按照iPhone的影响力,想来开发者不多久便会抛弃zoom。…

定义 iOS 设备的网页图标

苹果iOS设备(iPhone,iPad,iTouch)可以定义个一个类似原生app的的图标,将网页添加到主屏幕。这个设计主要用于Web应用程序,再通过定义启动画面和safari的渲染模式,让一个Web应用看起来就像是原生app一样。我觉得即使不是webapp,任何一个网站都可以考虑做这么一套图标,让用户将页面链接直接加到主屏幕方便他们直接一个点击就能访问到这个网站。 在苹果的官方文档里,这种用主屏幕图标代表的链接,称之为Web Clip(网页剪辑)。比如太平洋不仅适配了iPad的显示版本,还着重将这个功能提示的格外醒目,希望用户能尽可能利用系统的方便之处: 添加的方式很容易,制作对应各个分辨率的屏幕的图标,然后将它们放在网站的根目录下即可。但命名必须遵从apple给出的规则(就是我们常说的 apple-touch-icon),这样iOS就会默认去寻找这些图片下载并作为图标使用: apple-touch-icon.png apple-touch-icon-57x57.…