CN102929497A - 虚拟视口和具有光学缩放的固定定位 - Google Patents

Abstract

本发明涉及虚拟视口和具有光学缩放的固定定位。各种实施例利用了布局视口和与布局视口分开的视觉视口。布局视口被用于诸如页面布局操作以及向脚本报告文件对象模型值之类的事情。布局视口可以被认为是与初始包含框大小相当的初始矩形。初始包含框是包含对于用户来说初始可见的网络内容的包含框。视觉视口与布局视口分开并且允许相对于布局视口自由地操纵视觉视口。举例来说，当视觉视口与布局视口的边界相冲突时，视觉视口可以任意“推动”布局视口。视觉视口可以被认为是对于用户来说可见的矩形。

Description

虚拟视口和具有光学缩放的固定定位

背景技术

很多能触摸的web浏览器允许用户利用手势（比如夹紧手势）缩放网页。典型地，缩放功能被实现为页面的光学的拉伸，被称为“光学缩放”。通过定义，这与要求页面基于可见区域重新布置的W3C标准相抵触。

很多web浏览器基本上只是忽视该标准要求。而这又意味着其他特征停止工作或者与预期相比更难工作。这些特征包括固定位置元素和背景、报告在脚本中的（文件对象模型）DOM值以及页面布局的其他方面。这导致与使用这些特征的网站的兼容性问题，常常到了迫使这些站点创建针对特定浏览器或设备的特殊版本以便避免破坏的功能的程度。

发明内容

提供概要来以简化的形式介绍将在下面的具体实施方式中进一步描述的概念的选择。该概要并不意图识别要求保护的主题的关键特征或必要特征，也不是意图被用于帮助确定要求保护的主题的范围。

各种实施例利用了布局视口和与布局视口分开的视觉视口。布局视口被用于诸如页面布局操作以及向脚本报告文件对象模型值之类的事情。布局视口可以被认为是与初始包含框大小相当的初始矩形。初始包含框是包含对于用户来说初始可见的网络内容的包含框。视觉视口与布局视口分开并且允许相对于布局视口自由地操纵视觉视口。举例来说，当视觉视口与布局视口的边界相冲突时，视觉视口可以任意“推动”布局视口。视觉视口可以被认为是对于用户来说可见的矩形。

在一个或多个实施例中，固定元素被固定到布局视口，并且视觉视口能够独立于布局视口而摇动（pan）。当视觉视口达到布局视口的边缘时，布局视口能够开始与视觉视口一起摇动。

在一个或多个实施例中，视口可以被独立地修改。举例来说，视觉视口的大小可以被修改以便适应诸如屏幕上触摸键盘之类的覆盖式用户界面。这可以启动固定元素内的附加情景（比如触摸输入），并且当键盘可见时摇动/缩放固定元素。

附图说明

参考附图描述具体的说明。在附图中，附图标记最左边的（多个）数字指示该附图标记首次在其中出现的附图。在说明书和附图中的不同实例中使用的相同的附图标记可以表明类似的或相同的项目。

图1是根据一个或多个实施例的示例性实施方式中的环境的图示。

图2是更加详细地示出图1的示例性实施方式中的系统的图示。

图3示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图4示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图5示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图6示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图7示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图8示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图9示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图10示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图11示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图12示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图13示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图14示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图15示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图16示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图17示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图18示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图19示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图20示出了图示出根据一个或多个实施例的布局视口和视觉视口的一个可呈现文件的视图。

图21是描述了根据一个或多个实施例的方法中的步骤的流程图。

图22是描述了根据一个或多个实施例的方法中的步骤的流程图。

图23示出了可以被用来实施这里描述的各种实施例的示例性计算设备。

具体实施方式

综述

各种实施例利用了布局视口和与布局视口分开的视觉视口。布局视口被用于诸如页面布局操作以及向脚本报告文件对象模型值之类的事情。布局视口可以被认为是与初始包含框大小相当的初始矩形。初始包含框是包含对于用户来说初始可见的网络内容的包含框。视觉视口与布局视口分开并且允许相对于布局视口自由地操纵视觉视口。举例来说，当视觉视口与布局视口的边界相冲突时，视觉视口可以任意“推动”布局视口。视觉视口可以被认为是对于用户来说可见的矩形。

在一个或多个实施例中，固定元素被固定到布局视口，并且视觉视口能够独立于布局视口而运动，例如摇动。当视觉视口达到布局视口的边缘时，布局视口能够开始与视觉视口一起摇动。

在一个或多个实施例中，视口可以被独立地修改。举例来说，视觉视口的大小可以被修改以便适应诸如屏幕上触摸键盘之类的覆盖式用户界面。这可以启动固定元素内的附加情景（比如触摸输入），并且当键盘可见时摇动/缩放固定元素。

在下面的讨论中，首先描述可操作以采用这里描述的技术的示例性环境。然后描述各种实施例的示例性图示说明，其可以用在示例性环境中，也可以用在其他环境中。因此，示例性环境并不限于施行所描述的实施例，并且所描述的实施例并不限于实施在示例性环境中。

示例性环境

图1是可操作以采用在本文件中描述的直观显示技术的示例性实施方式中的环境100的图示。所示出的环境100包括可以按照各种方式配置的计算设备102的示例。举例来说，计算设备102可以被配置为传统的计算机（例如桌上型个人计算机、膝上型计算机等）、移动站、娱乐设施、通信地耦合到电视的机顶盒、无线电话、上网本、游戏控制台、手持式设备以及如关于图2所进一步描述的。因此，计算设备102的范围可以从具有充足的存储器和处理器资源的全资源设备（例如个人计算机、游戏控制台）到具有有限的存储器和/或处理器资源的低资源设备（例如传统的机顶盒、手持式游戏控制台）。计算设备102还包括使得该计算设备102施行如下面所描述的一个或多个操作的软件。

计算设备102包括提供如在本文件中所描述的功能的web浏览器104。可以连同任何适当类型的硬件、软件、固件或其组合来实施web浏览器。在至少一些实施例中，以驻留在某种类型的有形的计算机可读存储介质上的软件来实施web浏览器，将在下面提供所述存储介质的示例。

Web浏览器104表示使得用户能够浏览不同的网站并且消费与这些网站相关联的内容的功能。如将在下面详细描述的，web浏览器104包括视口模块106，该视口模块106包括布局视口模块107和视觉视口模块109。应当认识到并且理解的是，虽然视口模块被示出为web浏览器的一部分，但视口模块是可以被web浏览器104或其他应用利用的独立模块。可替换地或附加地，视口模块106可以包括不同于web浏览器104的一个或多个应用的一部分。

布局视口模块107实施布局视口，其被用于诸如页面布局操作以及向脚本报告文件对象模型值之类的事情。布局视口可以被认为是与初始包含框大小相当的初始矩形，该初始包含框包含对于用户来说初始可见的网络内容。

视觉视口模块109实施视觉视口，该视觉视口与布局视口分开并且允许相对于布局视口自由地操纵该视觉视口。举例来说，当视觉视口与布局视口的边界相冲突时，视觉视口可以任意“推动”布局视口。视觉视口可以被认为是对于用户来说可见的矩形。

在一个或多个实施例中，固定元素被固定到布局视口，并且视觉视口能够独立于布局视口而摇动。当视觉视口达到布局视口的边缘时，布局视口能够开始与视觉视口一起摇动。

在一个或多个实施例中，视口可以被独立地修改。举例来说，视觉视口的大小可以被修改以便适应诸如屏幕上触摸键盘之类的覆盖式用户界面。这可以启动固定元素内的附加情景（比如触摸输入），并且当键盘可见时摇动/缩放固定元素，如将在下面变得显而易见的那样。

计算设备102还包括手势模块105，其识别能够由一个或多个手指施行的手势并且使得与这些手势相对应的操作能够施行。手势可以由模块105以各种不同方式来识别。举例来说，手势模块105可以被配置为识别触摸输入，诸如接近使用触摸屏功能的计算设备102的显示设备108的用户手的手指。模块105可以用于识别单个手指的手势和边框手势（bezel gesture）、多手指/相同手的手势和边框手势、和/或多手指/不同手的手势和边框手势。

计算设备102还可以被配置为检测并且在（例如由用户手的一个或多个手指提供的）触摸输入与（例如由触针116提供的）触针输入之间进行区分。可以以各种方式来施行该区分，比如通过检测由用户手的手指接触的显示设备108的量对比由触针116接触的显示设备108的量。

因此，手势模块105可以支持各种不同的手势技术，这是通过识别触针和触摸输入以及各种不同类型的触摸输入之间的划分以及其影响（leverage）来实现的。

图2示出了一种示例性系统200，其示出了浏览器104、手势模块105以及视口模块106，被实施在其中多个设备通过中央计算设备进行互连的环境中。中央计算设备对于所述多个设备来说可以是本地的，或者对于所述多个设备来说可以是位于远程的。在一个实施例中，中央计算设备是“云”服务器群，其包括通过网络或因特网或其他装置连接到多个设备的一个或多个服务器计算机。

在一个实施例中，这种互连体系结构使得能够在多个设备中递送功能，以便向多个设备的用户提供通用的并且无缝的体验。多个设备中的每一个可以具有不同的物理要求和能力，并且中央计算设备使用平台，以便能够向设备递送既是为该设备定制的也是对于所有设备都通用的体验。在一个实施例中，创建目标设备的“类别”并且为一般类别的设备定制体验。设备的类别可以由所述设备的物理特征或使用或其他共同特性来限定。举例来说，如前面所描述的，计算设备102可以以各种不同方式来配置，比如用于移动202、计算机204以及电视206的使用。这些配置中的每一种具有一般地相对应的屏幕大小，并因此计算设备102可以被配置为在这个示例性系统200中的这些设备类别中的一种。例如，计算设备102可以假定移动202类别的设备，其包括移动电话、音乐播放器、游戏设备等。计算设备102还可以假定计算机204类别的设备，其包括个人计算机、膝上型计算机、上网本等。电视206配置包括涉及偶然环境中的显示的设备配置，例如电视、机顶盒、游戏控制台等。因此，这里所描述的技术可以由计算设备102的这些各种配置所支持，并且并不限于在下面的部分中描述的具体示例。

云208被示出为包括用于web服务212的平台210。平台210提取云208的硬件（例如服务器）和软件资源的基础功能，并因此可以充当“云操作系统”。举例来说，平台210可以提取资源来将计算设备102与其他计算设备连接。平台210还可以用来提取资源的定标（scaling）以便将相对应的标度的等级提供到所遭遇的对于经由平台210实施的web服务212的需求。也可以预期各种其他的示例，比如服务器群中的服务器的负载平衡、保护不受恶意方（例如垃圾邮件、病毒和其他恶意软件）的伤害等。

因此，云208被包括为属于经由因特网或其他网络对于计算设备102可用的软件和硬件资源的策略的一部分。

由手势模块支持的手势技术可以利用移动配置202中的触摸屏功能、计算机204配置中的跟踪板功能来检测，通过作为不涉及与特定输入设备相接触的自然用户接口（NUI）的支持的一部分的摄影机来检测，等等。此外，可以在系统200当中到处分配检测和识别输入以便认出特定手势的操作的施行，比如通过计算设备102和/或由云208的平台210支持的web服务212。

一般来说，这里所描述的任何功能都可以利用软件、固件、硬件（例如固定逻辑电路）、手动处理或这些实施方式的组合来实施。这里所使用的术语“模块”、“功能”和“逻辑”一般来说表示软件、固件、硬件或其组合。在软件实施方式的情况下，模块、功能或逻辑表示当在处理器（例如CPU或多个CPU）上执行或者由处理器执行时施行特定任务的程序代码。程序代码可以存储在一个或多个计算机可读存储器设备中。下面所描述的手势技术的特征是独立于平台的，这意味着可以在具有各种处理器的各种商业计算平台上实施这些技术。

在下面的讨论中，各个部分描述示例性实施例。标题为“示例性视口交互”的部分描述示出了根据一个或多个实施例的视觉视口与布局视口之间的交互的多个情景。接下来，标题为“示例性方法”的部分描述根据一个或多个实施例的示例性方法。最后，标题为“示例性设备”的部分描述可以被用来实施一个或多个实施例的示例性设备的各个方面。

描述了可以在其中利用浏览器的示例性操作环境之后，现在来考虑一种示例性浏览器、以及特别地根据一个或多个实施例的示例性视口交互的讨论。

示例性视口交互

图3在300处，一般性地示出了可以被看作是可呈现文件302的全知视图。该视图是“全知的”，这是因为它既表示了由视觉视口限定的当前对于用户来说可见的内容，又表示了当前对于用户来说不可见（如图中所示）的内容。在所示出和所描述的实施例中，光学缩放水平确定了视觉视口的大小。另外，视觉视口确定了向用户示出的可呈现文件的内容，正如将在下面变得显而易见的那样。

具体而言，在该示例中，在304处通过长虚线示出了布局视口。视觉视口306由细虚线示出。在该特定示例中，当页面加载时，布局视口304和视觉视口306初始具有相同的长宽比。正因如此，布局视口304和视觉视口306初始是同延的（coextensive）。此外，视图300包括所谓的固定位置元素308。该固定位置元素相对于布局视口304布置并且固定在布局视口304之内。为了正在描述的示例继续，将固定位置元素认为是社交网络聊天室，比如可以在Facebook上可以找到的那种。

回想一下，布局视口被用于诸如页面布局操作以及向脚本报告文件对象模型（DOM）值之类的事情。在至少一些实施例中，布局管线使用DOM来建立可呈现的显示树，然后显示模块将该显示树呈现为可以由用户通过web浏览器或其他适当配置的应用观看的内容。布局视口304可以被认为是与初始包含框大小相当的初始矩形。初始包含框是包含对于用户来说初始可见的网络内容的包含框。视觉视口306与布局视口304分开并且允许相对于布局视口304自由地操纵视觉视口306。全知视图300中位于视觉视口306之外的内容对于用户来说是不可见的。相反地，它出现在图中是为了向读者提供用于各个视口之间的交互的情境，正如将在下面描述的那样。

在所示出的和所描述的实施例中，布局视口304和视觉视口306可以具有下列属性，这些属性对于其中内容出现在用户期望内容出现的地方的有组织的逻辑用户体验来说有贡献并且有帮助。

首先，视觉视口306被配置为出现在布局视口304之内，正如将在下面变得显而易见的那样。具体而言，至少在所示出和所描述的实施例中，视觉视口306没有延伸到布局视口304之外。然而，在一些实施例中，视觉视口有可能大于布局视口。在这种情况下，页面将会缩小少于100%并且能够显示其他内容，例如空白空间、页面背景颜色、背景幕图像等等。视觉视口306可以在布局视口304之内调整大小。这是为了适应缩放功能以及其他功能。在包括那些具有覆盖式用户界面元素的实例在内的具体实例中，可以调整视觉视口306的大小以便保持刚刚在上面描述的属性。如上面所提到的，相对于布局视口304布置元素，并且当在视觉视口306之内时关于视觉视口304呈现元素。

当用户与视觉视口306交互时，关于相对于布局视口304已布置的那些元素的位置关系保持完好。此外，基于与视觉视口306的用户交互，布局视口304是可移动的。考虑到下面的描述，这些原则和属性将变得更加清楚。

参考图4，用户在由视觉视口306示出的内容上进行放大，该视觉视口306现在完全出现在布局视口304之内。因此，当用户放大时，视觉视口变得更小并且其内部的内容被放大。在所示出的和所描述的实施例中，该缩放被实现为光学缩放。在光学缩放中，放大内容而没有改变页面的布局。出现在页面上的项目只是被放大。因为用户看见的是视觉视口306之内出现的内容，因此固定位置元素308不再是可见的。但是，固定位置元素308相对于布局视口304保持位置上的固定。在该特定示例中，因为用户并没有关于位于布局视口之外的内容向上滚动或向下滚动，因此没有激发滚动事件并且也没有改变滚动偏移。正如本领域技术人员所理解的那样，当激发滚动事件时，可能会发生对于脚本引擎的回调，这允许脚本引擎更新DOM，从而使得已更新的DOM可以被用于重新布置内容，以便建立可以由web浏览器呈现的更新的显示树。

参考图5，已经按照箭头的方向将视觉视口306摇动到右底部，以便看见固定位置元素308的一部分。再次，在该特定示例中，因为用户并没有关于位于布局视口之外的内容向上滚动或向下滚动，因此没有激发滚动事件并且也没有改变滚动偏移。

参考图6，已经按照箭头的方向将视觉视口306摇动到固定位置元素308的左侧并且下降至布局视口304的底边缘。固定位置元素308现在是不可见的。在这点上，因为用户并没有关于位于布局视口之外的内容向上滚动或向下滚动，因此没有激发滚动事件并且也没有改变滚动偏移。

参考图7，已经按照箭头的方向将视觉视口306向下移动。在一个或多个实施例中，因为视觉视口306被配置为不延伸到布局视口304之外，因此在其他情况下会导致视觉视口306跨越布局视口304的底部边界的按照该方向的移动，作为替代地导致布局视口304随着视觉视口一起被移动或拖动。当这种情况发生时，滚动事件被激发并且滚动偏移被更新。通过激发滚动事件的再调用，可以更新DOM，这又可以被用于建立可呈现的显示树以便呈现用户看见的内容。此外，相对于布局视口304更新固定位置元件308的位置。再次，通过更新到DOM发生这种情况。

参考图8，按照箭头的方向将视觉视口306向上摇动到右侧，从而使得固定位置元素308的一部分得以示出。在该实例中，没有激发滚动事件并且没有改变滚动偏移。

参考图9，已经按照箭头的方向将视觉视口306向左侧和向上摇动，从而使得视觉视口306的顶部与布局视口304的顶部是同延的。在该示例中，没有激发滚动事件并且没有改变滚动偏移。现在假设，用户继续向上移动视觉视口306。作为一个示例，考虑图10。

在那里，用户已经按照箭头的方向将视觉视口306向上移动。作为结果，因为视觉视口306被配置为不延伸到布局视口304之外，因此布局视口304随着视觉视口306一起被移动或拖动。因为视觉视口306已经向上滚动通过内容，因此激发滚动事件并且更新滚动偏移。此外，相对于布局视口304更新固定位置元素308的位置。再次，通过更新到DOM发生这种情况。

参考图11，视觉视口306被缩小以便再次与布局视口304同延。这样，固定位置元素308现在是可见的。

如上所述，在一个或多个实施例中，可以独立地修改视口。举例来说，可以修改视觉视口的大小以便适应诸如屏幕上触摸键盘之类的覆盖式用户界面以及诸如“在页面上寻找”机制等的其他覆盖式用户界面。此外，可以将通知实现为覆盖式用户界面，其中视觉视口被修改以便适应该通知或多个通知。这可以启动固定元素内的附加情景（比如触摸输入），并且当键盘可见时摇动/缩放固定元素。作为一个示例，考虑图12。

在那里，显示出屏幕上触摸键盘。在该特定示例中，为了适应键盘的显示，已经调整视觉视口306的大小使其粗略地是布局视口304的一半。如在下面将变得显而易见的，通过这样做，允许在显示键盘的同时摇动到文件的全部区域。注意在该示例中，当调整视觉视口306的大小时，布局视口304保持不变。使用这种方法，消除键盘将不会使得视觉区域置于100%缩放矩形之外。在该特定示例中，键盘的显示并不导致滚动或摇动。

参考图13，来自图12的键盘已经消除。注意到，对消除键盘做出响应，已经调整视觉视口306的大小以便与布局视口304同延。这个情况与图3中所示出的在初始缩放操作之前的情况实际上相同。在该示例中，没有激发滚动事件并且也没有更新滚动偏移。

参考图14，按照与上面描述的类似方式来缩放视觉视口306。注意到固定位置元素308看不见。没有激发滚动事件并且也没有更新滚动偏移。

参考图15，显示出键盘，而这又调整了视觉视口306的大小。没有激发滚动事件并且也没有更新滚动偏移。

参考图16，已经消除键盘并且将视觉视口306的大小调整到其原始缩放的大小。没有激发滚动事件并且也没有更新滚动偏移。

参考图17，再次显示键盘，而这又调整了视觉视口306的大小。没有激发滚动事件并且也没有更新滚动偏移。

参考图18，已经将视觉视口306向下移动，从而使得视觉视口306的底部与布局视口304的底部同延。在这里，因为视觉视口306还没有被移动到在其他情况下会截去或延伸到布局视口304之外的位置，因此没有激发滚动事件并且也没有更新滚动偏移。

参考图19，已经将视觉视口306移动到右侧从而使得固定位置元素308出现。注意，在该示例中，键盘可以被利用来将文本输入到固定位置元素308中。现在，为什么在至少一些实施例中调整视觉视口306的大小是合乎期望的这一点变得显而易见。考虑到其中没有调整视觉视口306的大小以便适应键盘的情况。在该特定实例中，如果未调整大小的视觉视口被移动到相对于布局视口在固定位置元素308之上的位置，则键盘会遮挡固定位置元素308，并因此用户不能够将文本输入到固定位置元素中。因而，在比如这些和其他的一些实例中，调整视觉视口的大小使得用户能够重新定位视觉视口306以便使得固定位置元素308可见，并且利用诸如键盘之类的覆盖式用户界面与固定位置元素308进行有意义的交互。

参考图20，图19的键盘已经被消除并且视觉视口306已经被摇动到左侧并且向下移动，因此随着视觉视口306一起移动或拖动布局视口304。因而，激发了滚动事件并且更新了滚动偏移。

在考虑了根据一个或多个实施例的布局视口和视觉视口的各个示例以及它们的互动之后，现在考虑下面的示例性方法。

示例性方法

图21是描述了根据一个或多个实施例的方法中的步骤的流程图。该方法可以连同任何合适的硬件、软件、固件或其组合来施行。在至少一些实施例中，该方法可以通过具体实施在某些类型的计算机可读存储介质上的软件来施行，例如web浏览器之类的应用或其他应用。

步骤2100利用布局视口来布置用于呈现的内容。可以利用任何合适类型的布局视口，在上面提供了其示例。步骤2102利用视觉视口，在视觉视口之内内容对于用户来说是可见的。可以利用任何合适的视觉视口，在上面提供了其示例。步骤2104启动了视觉视口与布局视口之间的交互。在上面提供了交互的示例。在所示出的和所描述的实施例中，视觉视口与布局视口分开并且相对于布局视口自由地操纵视觉视口。举例来说，可以在布局视口之内放大和缩小视觉视口。另外的交互可以包括经由视觉视口的交互，其导致相对于布局视口施行动作。举例来说，相对于视觉视口的动作可以导致激发滚动事件，而这又导致布局视口改变。举例来说，基于用户与视觉视口的交互，布局视口可以随着视觉视口一起移动或拖动，正如上面所描述的。

此外，视觉视口与布局视口之间的交互会影响或者以其他方式包括固定位置元素或固定位置背景，正如上面所描述的。举例来说，当例如视觉视口使得布局视口移动时，这种交互能够导致固定位置元素随着布局视口一起重新定位。

图22是描述了根据一个或多个实施例的方法中的步骤的流程图。该方法可以连同任何合适的硬件、软件、固件或其组合来施行。在至少一些实施例中，该方法可以通过具体实施在某些类型的计算机可读存储介质上的软件来施行，例如web浏览器之类的应用或其他应用。

步骤2200利用布局视口来布置用于呈现的内容。可以利用任何合适类型的布局视口，在上面提供了其示例。步骤2202利用视觉视口，在视觉视口之内内容对于用户来说是可见的。可以利用任何合适的视觉视口，在上面提供了其示例。步骤2204修改了视觉视口的大小以便适应覆盖式用户界面。可以利用任何合适类型的覆盖式用户界面。举例来说，在至少一些实施例中，可以利用屏幕上的触摸键盘的形式的覆盖式用户界面。但是，应当认识到并且理解的是，在不背离要求保护的主题的精神和范围的情况下，可以利用其他的覆盖式用户界面。

在描述了根据一个或多个实施例的示例性方法之后，现在考虑讨论可以用来实施在上面描述的实施例的示例性设备。

示例性设备

图23示出了示例性设备2300的各部件，该示例性设备2300可以被实现为如参考图1和2所描述的任何类型的便携式设备和/或计算机设备，以便实施在此所描述的实施例。设备2300包括通信设备2302，其使得能够进行设备数据2304（例如，接收到的数据、正被接收的数据、为广播预定的数据、数据的数据包等）的有线和/或无线通信。设备数据2304或其他设备内容可以包括设备的配置设定、存储在设备上的媒体内容和/或与设备的用户相关联的信息。存储在设备2300上的媒体内容可以包括任何类型的音频数据、视频数据和/或图像数据。设备2300包括一个或多个数据输入2306，经由该数据输入可以接收任何类型的数据、媒体内容和/或输入，比如用户可选择的输入、消息、音乐、电视媒体内容、记录的视频内容、以及从任何内容和/或数据源接收的任何其他类型的音频数据、视频数据和/或图像数据。

设备2300还包括通信接口2308，其可以被实现为串行和/或并行接口、无线接口、任何类型的网络接口、调制解调器中的任何一个或多个，并且被实现为任何其他类型的通信接口。通信接口2308提供设备2300与通信网络之间的连接和/或通信链路，其他电子设备、计算设备和通信设备通过该通信接口与设备2300传送数据。

设备2300包括一个或多个处理器2310（例如微处理器、控制器等中的任何一种），其处理各种计算机可执行或可读的指令，以便控制设备2300的操作并且实施上面所描述的实施例。可替换地或附加地，可以利用硬件、固件或连同一般标识在2312处的处理和控制电路一起实现的固定逻辑电路中的任何一种或组合来实现设备2300。尽管未示出，设备2300可以包括系统总线或数据传送系统，其耦合设备内的各种部件。系统总线可以包括不同总线结构中的任何一种或组合，比如存储器总线或存储器控制器、外围总线、通用串行总线和/或利用各种总线体系结构中的任何一种的处理器或局域总线。

设备2300还包括计算机可读介质2314，比如一个或多个存储器部件，其示例包括随机存取存储器（RAM）、非易失性存储器（例如只读存储器（ROM）、闪存、EPROM、EEPROM等中的任何一种或多种）、以及盘存储设备。盘存储设备可以被实现为任何类型的磁或光存储设备，比如硬盘驱动、可记录和/或可重写的紧致盘（CD）、任何类型的数字通用盘（DVD）等。设备2300还可以包括大容量存储介质设备2316。

计算机可读介质2314提供数据存储机制，以便存储设备数据2304以及各种设备应用2318和任何其他类型的信息和/或与设备2300的操作方面相关的数据。举例来说，操作系统2320可以利用计算机可读介质2314保持为计算机应用并且在处理器2310上执行。设备应用2318可以包括设备管理器（例如，控制应用、软件应用、信号处理和控制模块、对于特定设备固有的代码、用于特定设备的硬件抽象层等）以及其他应用，该其他应用可以包括web浏览器、图像处理应用、诸如即时消息发送应用之类的通信应用、字处理应用和各种其他的不同应用。设备应用2318还包括实施这里所描述的技术的实施例的任何系统部件或模块。在该示例中，设备应用2318包括示出为软件模块和/或计算机应用的接口应用2322和手势捕获驱动器2324。手势捕获驱动器2324表示软件，其用于为接口提供被配置为捕获手势的设备（比如触摸屏、跟踪板、摄影机等）。可替换地或附加地，接口应用2322和手势捕获驱动器2324可以被实现为硬件、软件、固件或其任何组合。此外，计算机可读介质2314可以包括web浏览器2325，其功能如上所述。

设备2300还包括音频和/或视频输入输出系统2326，其向音频系统2328提供音频数据以及/或者向显示系统2330提供视频数据。音频系统2328和/或显示系统2330可以包括处理、显示、以及/或者以其他方式呈现音频、视频和图像数据的任何设备。视频信号和音频信号可以经由RF（射频）链路、S视频链路、复合视频链路、分量视频链路、DVI（数字视频接口）、模拟音频连接或其他类似的通信链路，从设备2300传送到音频设备和/或显示设备。在一个实施例中，音频系统2328和/或显示系统2330被实现为设备2300的外部部件。可替换地，音频系统2328和/或显示系统2330被实现为示例性设备2300的集成部件。

结论

在上面所描述的各种实施例利用了布局视口和与布局视口分开的视觉视口。布局视口被用于诸如页面布局操作以及向脚本报告文件对象模型值之类的事情。布局视口可以被认为是与初始包含框大小相当的初始矩形。初始包含框是包含对于用户来说初始可见的网络内容的包含框。视觉视口与布局视口分开并且允许相对于布局视口自由地操纵视觉视口。举例来说，当视觉视口与布局视口的边界相冲突时，视觉视口可以任意“推动”布局视口。视觉视口可以被认为是对于用户来说可见的矩形。

在一个或多个实施例中，固定元素被固定到布局视口，并且视觉视口能够独立于布局视口而摇动。当视觉视口达到布局视口的边缘时，布局视口能够开始与视觉视口一起摇动。

在一个或多个实施例中，视口可以被独立地修改。举例来说，视觉视口的大小可以被修改以便适应诸如屏幕上触摸键盘之类的覆盖式用户界面。这可以启动固定元素内的附加情景（比如触摸输入），并且当键盘可见时摇动/缩放固定元素。

尽管已经以特定于结构特征和/或方法动作的语言描述了各实施例，但是应当理解的是，在所附的权利要求书中所限定的各实施例没有必要局限于所描述的特定特征或动作。相反地，公开特定的特征和动作作为实施要求保护的各实施例的示例性形式。

Claims (10)

1. 具体实施计算机可读指令的一个或多个计算机可读存储介质，当执行所述计算机可读指令时实施包括以下步骤的方法：

利用布局视口来布置用于呈现在web浏览器中的内容；

在web浏览器中利用视觉视口，在所述视觉视口之内至少一些布置的内容是可见的，所述视觉视口是独立于布局视口可移动的，所述视觉视口具有由相关联的光学缩放水平确定的大小；以及

启动视觉视口和布局视口之间的交互。

2. 权利要求1的一个或多个计算机可读存储介质，其中所述视觉视口被配置为在布局视口之内放大或缩小。

3. 权利要求1的一个或多个计算机可读存储介质，其中所述布局视口被配置为具有相对于该布局视口布置的固定位置元素。

4. 权利要求1的一个或多个计算机可读存储介质，其中布置在所述布局视口之内的并且位于视觉视口之外的内容是不可见的。

5. 权利要求1的一个或多个计算机可读存储介质，其中所述视觉视口被配置为不延伸到布局视口之外。

6. 权利要求1的一个或多个计算机可读存储介质，其中所述视觉视口被配置为在布局视口之内可调整大小。

7. 权利要求1的一个或多个计算机可读存储介质，其中所述视觉视口被配置为使得布局视口随着视觉视口一起移动。

8. 权利要求1的一个或多个计算机可读存储介质，其中所述视觉视口被配置为使得布局视口随着视觉视口一起移动，并且其中所述布局视口被配置为具有当其随着视觉视口一起移动时随其移动的固定位置元素。

9. 具体实施计算机可读指令的一个或多个计算机可读存储介质，当执行所述计算机可读指令时实施包括以下步骤的方法：

利用布局视口来布置用于呈现的内容；

利用视觉视口，在所述视觉视口之内至少一些布置的内容是可见的，所述视觉视口具有由相关联的光学缩放水平确定的大小；以及

修改视觉视口的大小以便适应覆盖式用户界面。

10. 权利要求9的一个或多个计算机可读存储介质，其中所述视觉视口是独立于布局视口可移动的。

Images