第11章 获取地理位置信息

HTML5为window.navigator对象新增了一个geolocation属性

取得当前地理位置

void getCurrentPosition(onSuccess,onError,options);

第一个参数为获取成功执行的回调函数,第二个为失败时执行的回调函数,第三个为一些可选属性的列表(第二个和第三个可选)

navigator.geolocation.getCurrentPosition(function(position){

    //获取成功时的处理(参数position为一个position对象)

  })

getCurrentPosition方法的第二个参数为获取失败时调用的函数,可以是一个提示框等

当浏览器询问用户是否共享位置信息,选择否也会引发错误,回调函数有一个error对象,具有两个属性

code属性:用户拒绝了位置服务(值为1)  获取不到位置信息(值为2)  获取信息超时错误(值为3)

message属性:为一个字符串,包含了错误信息,在调试时有用处

getCurrentPosition方法的第三个参数,可以有:

enableHighAccuracy:是否要求高精度地理位置信息,需要综合考虑设备电量、具体地理情况来考虑,多数情况下为默认

timeout:对地理位置信息获取操作的限时操作(单位毫秒),在规定时间未获取到则返回错误

maximumAge:对地理位置信息进行缓存的有效时间(毫秒),过期后尝试再次获取信息

navigator.geolocation.getCurrentPosition(

    function(position){...},

    function(error){...},

    {maximumAge:60*1000*2,timeout:5000}

  )

持续监视当前地理位置的信息(定期自动获取)

int watchCurrentPosition(onSuccess,onError,options);

其参数与getCurrentPosition方法相同,同时返回一个数字,可以被clearWatch方法使用,停止监视

停止void clearWatch(watchId);

position对象:获取地理位置成功以后,调用的回调函数访问position对象的属性

latitude:维度

longitude:经度

altitude:海拔高度,不能获取则为null

accuracy经纬度的精度(米)

altitudeAccurancy海拔高度的精度(米)

heading设备的前进方法,面朝正北的顺时针角度表示,不能获取则为null

speed设备的前进速度,不能获取则为null(米/秒)

timestamp获取位置时的时间

第12章 CSS3概述

CSS3中,没有采用总体结构,而是采用分工协作的模块化结构

模块式的好处在于防止某些浏览器不完全支持一些功能时,拆分成多个模块以逐步支持

第3章 选择器

在样式中指定class缺点有:class本身没语义;使用混乱

属性选择器[att*=val][att^=val][att$=val]

结构性伪类选择器

伪类选择器就是CSS中已经定义好的选择器,不可以随便改名(前加“:”)

a:link a:visited a:hover a:active first-line first-letter before after

root选择器:将样式绑定到页面的根元素(整个<HTML>)

not选择器:排除这个结构元素下面的子结构元素

empty选择器:指定元素内容为空白时使用的样式

target选择器:<a href="#text1">文字</a>,跳转到id等于text1时,变化的样式

first-child last-child nth-child(:nth-child(3)第3个元素 若odd为奇数)和nth-last-child(:nth-last-child(3)倒数第3个元素 若even为偶数)

nth-of-type和nth-last-of-type,按照类型排序,上例是指全部元素的奇数元素的一个,这里指全部奇数元素的某一个

only-child选择器:仅仅只有一个子元素时应用样式

UI元素状态伪类选择器

除了结构性伪类选择器外,还有UI元素状态伪类选择器

:hover :active :focus :enabled(可用) :disabled(不可用):read-only(只读readonly="readonly") :read-write(非只读) :checked(radio单选框或checkbox复选框处于选取状态,Firefox必须写成-moz-checked)  :default(单选或复选框处于默认选取状态):indeterminate(任何一个单选框都没有被设定为选取状态时,整体的样式,用户选中其中一个则样式被取消):selection(元素处于选中状态)

通用兄弟元素选择器

<子元素>-<子元素之后的兄弟元素>{}

HTML5与CSS3权威指南.pdf6的更多相关文章

  1. Html5与CSS3权威指南 百度云下载

    Html5与CSS3权威指南 百度云下载 链接:http://pan.baidu.com/s/1hq6Dlvm 密码:php3

  2. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  3. 【HTML5 4】《HTML5与CSS3权威指南》 step1 导读

    一.教程重点:以 HTML5和CSS3的新功能和新特性 为导向,辅之以 实战型实例页面 二.内容概况: 第1部分:详细讲解HTML5相关知识,包括 各主流浏览器对HTML5的支持情况. HTML5与H ...

  4. HTML5与CSS3权威指南笔记案例1

    第1章 <!DOCTYPE html> <meta charset = "UTF-8"> <title> Search </title&g ...

  5. HTML5与CSS3权威指南

    第一章:Web时代的变迁 HTML5放心使用的理由: 兼容性:HTML5在老板本的浏览器上也可以正常运行: 实用性:HTML5内部并没有封装什么很复杂的,不切实际的功能,而只是封装了简单实用的功能: ...

  6. 读《HTML5与CSS3权威指南(上册)》笔记

    第二章 1.内容类型:“text/html”.DOCTYPE声明:<!DOCTYPE html>.指定字符编码:<meta charset="utf-8"> ...

  7. HTML5与CSS3权威指南.pdf9

    第21章 Media Queries相关样式 该模块中允许添加媒体查询(media query)表达式,用以指定媒体类型,根据媒体类型来选择使用的样式(显示器.便携设备.电视机) 使用方法@media ...

  8. HTML5与CSS3权威指南.pdf8

    第17章 与背景和边框相关的样式 与背景相关的新增属性 background-clip指定背景的显示范围 background-origin指定绘制背景图像时的起点 background-size指定 ...

  9. HTML5与CSS3权威指南.pdf5

    第9章 通信API 跨文档消息传输 HTML5提供了网页文档之间互相接收与发送信息的功能,不仅同源(域+端口号)的Web网页之间可以互相通信,甚至可以实现跨域通信 想要接受从其他窗口发过来的信息,要对 ...

随机推荐

  1. vim 配置文件 ,高亮+自动缩进+行号+折叠+优化

    vim 配置文件 ,高亮+自动缩进+行号+折叠+优化 将一下代码copy到 用户目录下 新建文件为  .vimrc保存即可生效: 如果想所有用户生效 请修改 /etc/vimrc (建议先cp一份)& ...

  2. getDrawingRect,getHitRect,getLocalVisibleRect,getGlobalVisibleRect

    本文主要大体讲下getHitRect().getDrawingRect().getLocalVisibleRect().getGlobalVisibleRect. getLocationOnScree ...

  3. Instructions Set JAVA_HOME System-Wide

    Instructions Set JAVA_HOME System-Wide 1 Start a root terminal session and then change directories t ...

  4. Custom template tags and filters

    Code layout Custom template tags and filters must live inside a Django app. If they relate to an exi ...

  5. 安卓手机无法连接VPN的解决办法

    这篇不能算是技术博客吧,但是在网上很难找到解决方案,至少我找了好久也没弄好.. 三种方案,因机而异,我就长话短说了: 一. "/system/xbin" 和 "/syst ...

  6. a href="#"与a href="####"的区别是什么

    前提是 :有滚动条. [感谢  黎明就在眼前 博客园园友] '#' 是有特殊意义,如果 '#' 后有内容会被认为是一个标签而从页面找到相应标签跳转到该处,找不到时会跳到页首,通常情况下使用“#ID”来 ...

  7. 多目标遗传算法 ------ NSGA-II (部分源码解析)状态报告 打印 report.c

    /* Routines for storing population data into files */ # include <stdio.h> # include <stdlib ...

  8. 如何将一个IP地址移出PBL,不然,国内邮件服务器不能正常发送国外邮件哟。

    550 OU-001 Mail rejected by Outlook for policy reasons. If you are not an email/network admin please ...

  9. Freemarker 对null值报错的处理

    忽略null值 假设前提:user.name为null ${user.name},异常 ${user.name!},显示空白 ${user.name!'vakin'},若user.name不为空则显示 ...

  10. [wikioi]石子归并

    http://wikioi.com/problem/1048/ 区间型动态规划.参考PPT:http://wenku.baidu.com/view/73c1ded5b9f3f90f76c61bc4.h ...