11 移动设备API.pdfVIP

6.11 移动设备API 为了更好地为移动设备服务，HTML 5推出了⼀系列针对移动设备的API 。 Viewport Geolocation API getCurrentPosition⽅法 watchPosition⽅法和clearWatch⽅法 Vibration API Luminosity API rientation API 参考链接 Viewport Viewport指的是⽹ 的显⽰区域，也就是不借助滚动条的情况下，⽤户可以看到的部 分⽹ ⼤⼩，中⽂译为“视⼜” 。正常情况下，viewport和浏览器的显⽰窗⼜是⼀样⼤ ⼩的。但是，在移动设备上，两者可能不是⼀样⼤⼩。 ⽐如，⼿机浏览器的窗⼜宽度可能是640像素，这时viewport宽度就是640像素，但是 ⽹ 宽度有950像素，正常情况下，浏览器会提供横向滚动条，让⽤户查看窗⼜容纳 不下的310个像素。另⼀种⽅法则是，将viewport设成950像素，也就是说，浏览器的 显⽰宽度还是640像素，但是⽹ 的显⽰区域达到950像素，整个⽹ 缩⼩了，在浏览 器中可以看清楚全貌。这样⼀来，⼿机浏览器就可以看到⽹ 在桌⾯浏览器上的显⽰ 效果。 viewport缩放规则，需要在HTML ⽹ 的head部分指定。 head meta name=viewport content=width=device-width, initial-sca /head 上⾯代码指定，viewport的缩放规则是，缩放到当前设备的屏幕宽度 （device- width ），初始缩放⽐例 （initial-scale ）为1倍，禁⽌⽤户缩放 （user-scalable ）。 viewport 全部属性如下。 width: viewport宽度 height: viewport⾼度 initial-scale: 初始缩放⽐例 maximum-scale: 最⼤缩放⽐例 minimum-scale: 最⼩缩放⽐例 user-scalable: 是否允许⽤户缩放 其他的例⼦如下。 meta name = viewport content = width = 320, initial-scale = 2.3, user-scalable = no Geolocation API Geolocation接⼜⽤于获取⽤户的地理位置。它使⽤的⽅法基于GPS或者其他机制 （⽐ 如IP地址、Wifi热点、⼿机基站等）。 下⾯的⽅法，可以检查浏览器是否⽀持这个接⼜。 i (navigator.geolocation) { // ⽀持 } else { // 不⽀持 } 这个API的⽀持情况⾮常好，所有浏览器都⽀持 （包括IE 9+ ），所以上⾯的代码不是 很必要。 getCurrentPosition⽅法 getCurrentPosition⽅法，⽤来获取⽤户的地理位置。使⽤它需要得到⽤户的授权，浏 览器会跳出⼀个对话框，询问⽤户是否许可当前 ⾯获取他的地理位置。必须考虑两 种情况的回调函数：⼀种是同意授权，另⼀种是拒绝授权。如果⽤户拒绝授权，会抛 出⼀个错误。 navigator.geolocation.getCurrentPosition(geoSuccess,geoError); 上⾯代码指定了处理当前地理位置的两个回调函数。 （1）同意授权 如果⽤户同意授权，就会调⽤geoSuccess 。 unction geoSuccess(event) { console.log(event.coords.latitude + , + event.coords.longitu } geoSuccess的参数是⼀个event对象。event有两个属性：timestamp和coords 。timestamp 属性是⼀个时间戳，返回获得位置信息的具体时间。coords属性指向⼀个对象，包含 了⽤户的位置信息，主要是以下⼏个值： coords.latitude ：纬度 coords.longitude ：经度 coords.accuracy ：精度 coords.altitude ：海拔 coords