专利名称：页面布局自适应方法及装置的制作方法
技术领域：
本发明涉及网页设计领域，尤其涉及一种页面布局自适应方法及装置。
背景技术：
电子地图网站的主要功能，在于将用户关心的信息结合地图的方式展现出来，以 更直观的方式为用户提供诸如购物、交通出行等生活信息服务。但是，在显示地图页面时， 经常会遇到同一个地图页面，在不同分辨率的显示器中、不同大小浏览器窗口中以及不同 类型浏览器中，显示的地图页面效果不同的情况，因此，如何实现地图页面的自适应，即如 何将同一个地图页面在不同分辨率的显示器中、不同大小的浏览器窗口中以及不同类型的 浏览器中，显示相同的地图页面效果，成为衡量该地图网站质量好坏的重要指标。目前较通用的实现页面布局自适应的方法，主要是通过调整页面元素的百分比相 对高度和宽度实现，该种方案包括当元素的父元素高度和宽度属性发生变化时，其相应属 性的绝对值也跟着变化，同时，保留页面级别的滚动条，以保证浏览器的窗口大小发生变化 时页面元素不至于发生变形而导致布局混乱。但是，在发明人实施上述方案时，由于页面中存在页面级的滚动条，地图大小不能 自动伸缩，当窗口变小时，不能与之前窗口显示相同的内容，用户必须要手动滑动滚动条才 能看到地图页面的全部内容，使得用户查看信息很不方便，用户体验效果很差。
发明内容
本发明的实施例提供一种页面布局自适应方法及装置，能够在不同分别率的屏幕 中、不同类型浏览器以及不同大小浏览器窗口中，显示相同的页面内容，方便用户查看页面 内容，提高了用户体验。为达到上述目的，本发明的实施例采用如下技术方案一种页面布局自适应方法，包括获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少一个参数，该参数包 括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型；根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度；根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽度，设 置所述页面文档中可变区域的高度和宽度；调整所述页面文档中固定区域的位置。一种页面布局自适应装置，包括第一获取单元，用于获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少 一个参数，该参数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型；第二获取单元，用于根据所述第一获取单元获取的所述屏幕显示参数，获取当前 页面的页面文档的高度和宽度；设置单元，用于根据所述第二获取单元获取的所述页面文档的高度和宽度以及所
4述页面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽度；调整单元，用于调整所述页面文档中固定区域的位置。本发明实施例提供的技术方案，在显示当前页面时，先获取屏幕分辨率、浏览器的 窗口大小以及用户当前使用浏览器的类型中的至少一个屏幕显示参数，并根据该屏幕显示 参数，获取当前页面的页面文档的高度和宽度，进而根据该页面文档的高度和宽度设置该 页面文档中可变区域的高度和宽度，并调整页面文档中固定区域的位置，从而实现了在不 同分别率的屏幕中、不同类型浏览器以及不同大小浏览器窗口中，显示相同的页面内容，方 便用户查看页面内容，提高了用户体验。
为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现 有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本 发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以 根据这些附图获得其他的附图。图1为本发明实施例1中页面布局自适应方法的流程图；图2为本发明实施例2中页面的页面文档布局结构示意图；图3为本发明实施例2中页面布局自适应方法的流程图；图4为本发明实施例3中页面布局自适应方法的流程图；图5为本发明实施例4中页面布局自适应方法的流程图；图6为本发明实施例5中一种页面布局自适应装置的组成框图；图7为本发明实施例5中另一种页面布局自适应装置的组成框图；图8为本发明实施例5中另一种页面布局自适应装置的组成框图；图9为本发明实施例5中另一种页面布局自适应装置的组成框图；图10为本发明实施例5中另一种页面布局自适应装置的组成框图。
具体实施例方式下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完 整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于 本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其他 实施例，都属于本发明保护的范围。实施例1本发明实施例提供一种页面布局自适应方法，如图1所示，该方法包括101、获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少一个参数，该参 数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型。其中，当获取的是屏幕分辨率时，可以在当加载当前页面时获取；当获取的是浏览 器的窗口大小时，可以在加载页面时获取浏览器的窗口大小，也可以在浏览器的窗口大小 发生变化时获取所述浏览器的窗口大小；当获取的是用户当前使用浏览器的类型时，可以 在打开浏览器时获取所述用户当前使用浏览器的类型。102、根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度。
5
其中，所述根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度，可以 包括当所述屏幕显示参数为屏幕分辨率、浏览器的窗口大小中的至少一个参数时，根 据所述屏幕显示参数获取当前页面的页面文档的高度和宽度，包括根据所述屏幕显示参 数计算所述当前浏览器窗口的高度和宽度；获取所述当前浏览器窗口中地址栏、菜单栏和 状态栏的高度之和、宽度之和；将所述当前页面的高度和宽度分别减去所述高度之和、所述 宽度之和，得到所述页面文档的高度和宽度。当所述屏幕显示参数中包括所述用户当前使用浏览器的类型时，所述根据所述屏 幕显示参数获取当前页面的页面文档的高度和宽度，包括根据所述浏览器的类型确定与 所述浏览器的类型对应的页面布局中所包含元素的样式参数；根据所述元素的样式参数获 取当前页面的页面文档的高度和宽度。103、根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽 度，设置所述页面文档中可变区域的高度和宽度。其中，所述根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度 和宽度，设置所述页面文档中可变区域的高度和宽度，可以包括获取所述页面文档中固定区域的高度和宽度；将所述页面文档的高度和宽度分 别减去所述页面文档中固定区域的高度和宽度，得到所述页面文档中可变区域的高度和宽 度；按照所述得到所述页面文档中可变区域的高度和宽度，设置所述页面文档中可变区域 的高度和宽度。104、调整所述页面文档中固定区域的位置。其中，所述调整所述页面文档中固定区域的位置，包括确定所述固定区域的水平 位置和垂直位置，并根据所述确定的水平位置和垂直位置调整所述页面文档中固定区域的 位置；其中，确定页面文档中与所述可变区域相邻的右侧固定区域的水平位置时，可以 通过确定该固定区域的左侧水平位置确定，而确定该固定区域的左侧水平位置，可以通过 以下公式确定，该公式为左侧水平位置=与所述可变区域相邻的左侧固定区域的宽度+ 可变区域的宽度；该左侧水平位置的单位为屏幕像素(PX)。确定页面文档中与所述可变区域相邻的下方固定区域的垂直位置时，可以通过确 定该固定区域的上端的垂直位置确定，而确定该固定区域的上端的垂直位置，可以通过以 下公式确定，该公式为左侧水平位置=与所述可变区域相邻的左侧固定区域的宽度+可 变区域的宽度；该左侧水平位置的单位为屏幕像素(PX)。本发明实施例中，在显示当前页面时，先获取屏幕分辨率、浏览器的窗口大小以及 用户当前使用浏览器的类型中的至少一个屏幕显示参数，并根据该屏幕显示参数，获取当 前页面的页面文档的高度和宽度，进而根据该页面文档的高度和宽度设置该页面文档中可 变区域的高度和宽度，并调整页面文档中固定区域的位置，从而实现了在不同分辨率的屏 幕中、不同类型浏览器以及不同大小的浏览窗口中，显示相同的页面内容，方便用户查看页 面内容，提高了用户体验。实施例2本发明实施例提供一种页面布局自适应方法，该方法具体以根据屏幕分辨率实现
6页面布局自适应，结合图2和图3具体阐述该方法。图2为本发明提供的自适应应用页面布 局的页面文档结构示意图，该示意图中包括三部分，页面文档的上部包含公司Logo区域、 模块导航区域以及自动扩展区域；页面文档的中部包含地图显示区域和文本显示区域两个 部分；页面文档的底部则包含用于显示公司版权信息的公司版权区域；上述三个部分中根 据区域是否可变，又可分为页面文档的固定区域和可变区域，该页面文档的固定区域包括 公司Logo区域、模块导航区、文本显示区域以及公司版权区域；该页面文档的可变区域包 括自动扩展区域和地图显示区域。该方法如图3所示，包括201、系统获取屏幕分辨率。其中，当加载当前页面时，系统获取本机的屏幕分辨率。202、所述系统根据所述屏幕分辨率获取当前页面的页面文档的高度和宽度，保证 页面文档中的所有元素的高度和宽度均不超过所述页面文档的高度和宽度。其中，所述系统在获取了本机的屏幕分辨率后，根据所述屏幕分辨率获取当前页 面的页面文档的高度和宽度；所述根据所述屏幕分辨率获取当前页面的页面文档的高度和 宽度，可以采用以下方法，该方法包括根据所述屏幕分别率计算所述当前浏览器窗口的高度和宽度；获取所述当前浏览 器窗口中地址栏、菜单栏和状态栏的高度之和、宽度之和；将所述当前浏览器窗口的高度和 宽度分别减去所述高度之和、所述宽度之和，得到所述页面文档的高度和宽度。203、根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽 度，设置所述页面文档中可变区域的高度和宽度。其中，所述根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度 和宽度，设置所述页面文档中可变区域的高度和宽度，可以采用以下方法，该方法包括获取所述页面文档中固定区域的高度和宽度；将所述页面文档的高度和宽度分 别减去所述页面文档中固定区域的高度和宽度，得到所述页面文档中可变区域的高度和宽 度；按照所述得到所述页面文档中可变区域的高度和宽度，设置所述页面文档中可变区域 的高度和宽度。本发明实施例中，如图2所示的页面布局，其由三部分组成，所述设置所述页面文 档中可变区域的高度和宽度可以为首先，系统获取所述页面文档的上部的固定区域的宽度，即获取Logo区域和模块 导航区域的宽度之和，将所述页面文档的宽度减去所述页面文档中Logo区域和模块导航 区域的宽度之和，得到自动扩展区域的宽度，并按照所述得到所述自动扩展区域的宽度设 置所述自动扩展区域的宽度，并按照Logo区域的高度设置所述自动扩展区域的高度。其次，系统获取所述页面文档的固定区域的高度，即获取Logo区域和公司版权区 域的高度之和，将所述页面文档的高度减去所述页面文档中Logo区域和公司版权区域的 高度之和，得到地图显示区域的高度；获取所述页面文档的中部的固定区域的宽度，即获取 文本显示区域的宽度，将所述页面文档的宽度减去所述页面文档中文本显示区域的宽度， 得到地图显示区域的宽度，按照所述获取的地图显示区域的高度和宽度，设置所述地图显 示区域的高度和宽度。完成该设置后，所述页面文档的中部区域自动撑开。204、调整所述页面文档中固定区域的位置，使所述页面文档的各区域撑开。其中，本发明实施例中，所述调整所述页面文档中固定区域的位置，如图2所示，
7调整所述模块导航区域和文本显示区域两个部分的位置。根据实施例1中的步骤104中所 述，确定所述模块导航区域的位置包括确定该模块导航区域的左侧水平位置，确定该模块 导航区域的左侧水平位置为Logo区域的宽度+自动扩展区域的宽度；确定该模块导航区 域的垂直位置为=Logo区域和自动扩展区域的垂直位置。确定文本显示区域的位置包括确定该文本显示区域的左侧水平位置，确定该文 本显示区域的左侧水平位置为地图显示区域的宽度；确定该文本显示区域的垂直位置 为该块模导航区域的高度。本发明实施例中，在加载当前页面时，系统获取本机的屏幕分辨率，并根据该屏幕 分辨率获取当前页面的页面文档的高度和宽度，进而根据该页面文档的高度和宽度设置该 页面文档中可变区域的高度和宽度，并调整页面文档中固定区域的位置，从而实现了在不 同分辨率的屏幕中，显示相同的页面内容，方便用户查看页面内容，提高了用户体验。实施例3本发明实施例提供一种页面布局自适应方法，该方法以根据器浏览器的窗口大小 实现页面布局自适应为例，结合图2和图4具体阐述该方法，该方法如图4所示，包括301、系统获取浏览器的窗口大小。其中，所述获取浏览器的窗口大小可以在加载页面时获取浏览器的窗口大小，也 可以在浏览器的窗口大小发生变化时，获取所述浏览器的窗口大小。302、所述系统根据所述浏览器的窗口大小获取当前页面的页面文档的高度和宽 度，保证页面文档中的所有元素的高度和宽度均不超过所述页面文档的高度和宽度。其中，所述系统在获取了浏览器的窗口大小后，根据所述浏览器的窗口大小，获取 当前页面的页面文档的高度和宽度；所述根据浏览器的窗口大小，获取当前页面的页面文 档的高度和宽度，可以采用以下方法，该方法包括获取所述当前浏览器窗口中地址栏、菜单栏和状态栏的高度之和、宽度之和；将所 述当前浏览器窗口的高度和宽度分别减去所述高度之和、所述宽度之和，得到所述页面文 档的高度和宽度。303、根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽 度，设置所述页面文档中可变区域的高度和宽度。其中，所述根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度 和宽度，设置所述页面文档中可变区域的高度和宽度的方法，可以参考实施例2中的步骤 203中的相应描述，本发明实施例此处将不再赘述。304、调整所述页面文档中固定区域的位置，使所述页面文档的各区域撑开。其中，调整所述页面文档中固定区域的位置的具体描述，可以参考实施例2中的 步骤204中的相应描述，本发明实施例此处将不再赘述。本发明实施例中，在显示当前页面的窗口变化时，系统获取当前窗口的大小，并根 据该窗口的大小获取当前页面的页面文档的高度和宽度，进而根据该页面文档的高度和宽 度设置该页面文档中可变区域的高度和宽度，并调整页面文档中固定区域的位置，从而实 现了在不同大小的浏览窗口中，显示相同的页面内容，方便用户查看页面内容，提高了用户 体验。实施例4
8
本发明实施例提供一种页面布局自适应方法，本发明实施例以根据浏览器的类型 实现页面布局自适应为例，具体阐述该方法，如图5所示，该方法包括401、系统获取用户当前使用浏览器的类型；其中，目前使用的主流浏览器的类型包括:IE(IE6, IE7，IE8)，FireFox 3. 0及以 上，Safari、以及Opera等，上述不同类型的浏览器使用W3C和微软IE标准。402、根据所述用户当前使用浏览器的类型获取当前页面的页面文档的高度和宽度。其中，根据所述用户当前使用浏览器的类型获取当前页面的页面文档的高度和宽 度，可以采用以下方法，包括根据所述浏览器的类型确定与所述浏览器的类型对应的页面布局中所包含元素 的样式参数；根据所述元素的样式参数获取当前页面的页面文档的高度和宽度，具体根据 预设的浏览器类型与页面布局中所包含元素的样式参数的对应关系，确定与所述浏览器的 类型对应的页面布局中所包含元素的样式参数。其中，所述页面布局中所包含元素的样式 参数可以包含元素的高度、宽度、位置以及文字颜色、背景颜色等参数，但本发明实施例对 此不进行限制，还可以是其他参数。403、根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽 度，设置所述页面文档中可变区域的高度和宽度。其中，所述根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度 和宽度，设置所述页面文档中可变区域的高度和宽度的方法，可以参考实施例2中的步骤 203中的相应描述，本发明实施例此处将不再赘述。404、调整所述页面文档中固定区域的位置，使所述页面文档的各区域撑开。其中，调整所述页面文档中固定区域的位置的具体描述，可以参考实施例2中的 步骤204中的相应描述，本发明实施例此处将不再赘述。本发明实施例中，当用户使用不同类型的浏览器时，系统根据预设的浏览器类型 与页面布局中所包含元素的样式参数的对应关系，确定与所述浏览器的类型对应的页面布 局中所包含元素的样式参数，并确定当前页面文档的高度和宽度，进而根据该页面文档的 高度和宽度设置该页面文档中可变区域的高度和宽度，并调整页面文档中固定区域的位 置，从而保证在不同类型的浏览器中，显示相同的页面内容，方便用户查看页面内容，提高 了用户体验。需要说明的是，用户在具体实施页面的自适应方案时，可以根据屏幕分辨率、浏览 器的窗口大小或用户当前使用浏览器的类型中的一个参数，参考实施例2、实施例3以及实 施例4，实现页面布局的自适应；当然，用户还可以根据屏幕分辨率、浏览器的窗口大小或 用户当前使用浏览器的类型中的至少两个参数，实现页面布局的自适应，本发明实施例对 此不进行限制。实施例5本发明实施例提供一种页面布局自适应装置，如图6所示，该装置包括第一获取 单元51、第二获取单元52、设置单元53和调整单元54。第一获取单元51，用于屏幕显示参数，所述屏幕显示参数为以下参数中的至少一 个参数，该参数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型。其
9中，当第一获取单元51获取的是屏幕分辨率时，可以在当加载当前页面时获取；当第一获 取单元51获取的是浏览器的窗口大小时，可以在加载页面时获取浏览器的窗口大小，也可 以在浏览器的窗口大小发生变化时，获取所述浏览器的窗口大小；当获取的是用户当前使 用浏览器的类型时，可以在打开浏览器时获取所述用户当前使用浏览器的类型。第二获取单元52，用于根据所述第一获取单元51获取的所述屏幕显示参数，获取 当前页面的页面文档的高度和宽度。设置单元53，用于根据所述第二获取单元52获取的所述页面文档的高度和宽度 以及所述页面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽 度；调整单元54，用于调整所述页面文档中固定区域的位置。进一步的，如图7所示，当所述第一获取单元51获取的屏幕显示参数中包含屏幕 分辨率时，所述第二获取单元52包括第一计算模块521、第一获取模块522和第二计算模 块 523。在所述第二获取单元52获取当前页面的页面文档的高度和宽度时，第一计算模 块521，用于根据所述屏幕显示参数计算所述当前浏览器窗口的高度和宽度；第一获取模 块522，用于获取所述第一计算模块得到的所述当前浏览器窗口中地址栏、菜单栏和状态栏 的高度之和、宽度之和；第二计算模块523，用于将所述第一计算模块521得到的所述当前 浏览器窗口的高度和宽度，分别减去所述第一获取模块522获取的所述高度之和、所述宽 度之和，得到所述页面文档的高度和宽度。进一步的，如图8所示，当所述第一获取单元51获取的屏幕显示参数中包含浏览 器的窗口大小时，所述第二获取单元52包括第二获取模块524和第三计算模块525。在所述第二获取单元52获取当前页面的页面文档的高度和宽度时，第二获取模 块524，用于获取所述当前浏览器窗口中地址栏、菜单栏和状态栏的高度之和、宽度之和； 第三计算模块525，用于将所述当前浏览器窗口的高度和宽度分别减去所述第二获取模块 524获取的所述高度之和、所述宽度之和，得到所述页面文档的高度和宽度。进一步的，如图9所示，当所述第一获取单元51获取的所述屏幕显示参数中包括 所述用户当前使用浏览器的类型时，所述第二获取单元52包括确定模块526和第三获取 模块527。在所述第二获取单元52获取当前页面的页面文档的高度和宽度时，确定模块 526，用于根据所述浏览器的类型确定与所述浏览器的类型对应的页面布局中所包含元素 的样式参数；第三获取模块527，用于根据所述确定模块526确定的所述元素的样式参数获 取当前页面的页面文档的高度和宽度。进一步的，如图10所示，所述设置单元53包括第二获取模块531、第三计算模块 532和设置模块533。在所述设置单元53设置所述页面文档中可变区域的高度和宽度时，第二获取模 块531，用于获取所述页面文档中固定区域的高度和宽度；第三计算模块532，用于将所述 第二计算模块531计算得到的所述页面文档的高度和宽度，分别减去所述页面文档中固定 区域的高度和宽度，得到所述页面文档中可变区域的高度和宽度；设置模块533，用于按照 所述第三计算模块532计算得到所述页面文档中可变区域的高度和宽度，设置所述页面文
10档中可变区域的高度和宽度。本发明实施例中，在显示当前页面时，先获取屏幕分辨率、浏览器的窗口大小以及 用户当前使用浏览器的类型中的至少一个屏幕显示参数，并根据该屏幕显示参数，获取当 前页面的页面文档的高度和宽度，进而根据该页面文档的高度和宽度设置该页面文档中可 变区域的高度和宽度，并调整页面文档中固定区域的位置，从而实现了在不同分辨率的屏 幕中、不同类型浏览器以及不同大小的浏览窗口中，显示相同的页面内容，方便用户查看页 面内容，提高了用户体验。通过以上的实施方式的描述，所属领域的技术人员可以清楚地了解到本发明可借 助软件加必需的通用硬件的方式来实现，当然也可以通过硬件，但很多情况下前者是更佳 的实施方式。基于这样的理解，本发明的技术方案本质上或者说对现有技术做出贡献的部 分可以以软件产品的形式体现出来，该计算机软件产品存储在可读取的存储介质中，如计 算机的软盘，硬盘或光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机， 服务器，或者网络设备等)执行本发明各个实施例所述的方法。以上所述，仅为本发明的具体实施方式
，但本发明的保护范围并不局限于此，任何 熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵 盖在本发明的保护范围之内。因此，本发明的保护范围应以所述权利要求的保护范围为准。
1权利要求
一种页面布局自适应方法，其特征在于，包括获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少一个参数，该参数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型；根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度；根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽度；调整所述页面文档中固定区域的位置。
2.根据权利要求1所述的方法，其特征在于，当所述屏幕显示参数中包含屏幕分辨率 时，所述根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度，包括根据所述屏幕显示参数计算所述当前浏览器窗口的高度和宽度； 获取所述当前浏览器窗口中地址栏、菜单栏和状态栏的高度之和、宽度之和； 将所述当前浏览器窗口的高度和宽度分别减去所述高度之和、所述宽度之和，得到所 述页面文档的高度和宽度。
3.根据权利要求1所述的方法，其特征在于，当所述屏幕显示参数中包含浏览器的窗 口大小时，所述根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度，包括获取所述当前浏览器窗口中地址栏、菜单栏和状态栏的高度之和、宽度之和； 将所述当前浏览器窗口的高度和宽度分别减去所述高度之和、所述宽度之和，得到所 述页面文档的高度和宽度。
4.根据权利要求1所述的方法，其特征在于，当所述屏幕显示参数中包括所述用户当 前使用浏览器的类型时，所述根据所述屏幕显示参数获取当前页面的页面文档的高度和宽 度，包括根据所述浏览器的类型确定与所述浏览器的类型对应的页面布局中所包含元素的样 式参数；根据所述元素的样式参数获取当前页面的页面文档的高度和宽度。
5.根据权利要求1所述的方法，其特征在于，所述根据所述页面文档的高度和宽度以 及所述页面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽度， 包括获取所述页面文档中固定区域的高度和宽度；将所述页面文档的高度和宽度分别减去所述页面文档中固定区域的高度和宽度，得到 所述页面文档中可变区域的高度和宽度；按照所述得到所述页面文档中可变区域的高度和宽度，设置所述页面文档中可变区域 的高度和宽度。
6. 一种页面布局自适应装置，其特征在于，包括第一获取单元，用于获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少一个 参数，该参数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型；第二获取单元，用于根据所述第一获取单元获取的所述屏幕显示参数，获取当前页面 的页面文档的高度和宽度；设置单元，用于根据所述第二获取单元获取的所述页面文档的高度和宽度以及所述页 面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽度；调整单元，用于调整所述页面文档中固定区域的位置。
7.根据权利要求6所述的装置，其特征在于，当所述第一获取单元获取的屏幕显示参 数中包含屏幕分辨率时，所述第二获取单元包括第一计算模块，用于根据所述屏幕显示参数计算所述当前浏览器窗口的高度和宽度；第一获取模块，用于获取所述第一计算模块得到的所述当前浏览器窗口中地址栏、菜 单栏和状态栏的高度之和、宽度之和；第二计算模块，用于将所述第一计算模块得到的所述当前浏览器窗口的高度和宽度， 分别减去所述第一获取模块获取的所述高度之和、所述宽度之和，得到所述页面文档的高 度和宽度。
8.根据权利要求6所述的装置，其特征在于，当所述第一获取单元获取的屏幕显示参 数中包含浏览器的窗口大小时，所述第二获取单元包括第二获取模块，用于获取所述当前浏览器窗口中地址栏、菜单栏和状态栏的高度之和、 宽度之和；第三计算模块，用于将所述当前浏览器窗口的高度和宽度分别减去所述第二获取模块 获取的所述高度之和、所述宽度之和，得到所述页面文档的高度和宽度。
9.根据权利要求6所述的装置，其特征在于，当所述第一获取单元获取的所述屏幕显 示参数中包括所述用户当前使用浏览器的类型时，所述第二获取单元包括确定模块，用于根据所述浏览器的类型确定与所述浏览器的类型对应的页面布局中所 包含元素的样式参数；第三获取模块，用于根据所述确定模块确定的所述元素的样式参数获取当前页面的页 面文档的高度和宽度。
10.根据权利要求6所述的装置，其特征在于，所述设置单元包括第二获取模块，用于获取所述页面文档中固定区域的高度和宽度；第三计算模块，用于将所述第二计算模块计算得到的所述页面文档的高度和宽度，分 别减去所述页面文档中固定区域的高度和宽度，得到所述页面文档中可变区域的高度和宽 度；设置模块，用于按照所述第三计算模块计算得到所述页面文档中可变区域的高度和宽 度，设置所述页面文档中可变区域的高度和宽度。
全文摘要
本发明实施例公开了一种页面布局自适应方法及装置，涉及网页设计领域，能够在不同分别率的屏幕中、不同类型的浏览器中以及不同大小的浏览器窗口中，显示相同的页面内容，方便用户查看页面内容，提高了用户体验。本发明方法包括获取屏幕显示参数，所述屏幕显示参数为以下参数中的至少一个参数，该参数包括屏幕分辨率、浏览器的窗口大小以及用户当前使用浏览器的类型；根据所述屏幕显示参数获取当前页面的页面文档的高度和宽度；根据所述页面文档的高度和宽度以及所述页面文档中固定区域的高度和宽度，设置所述页面文档中可变区域的高度和宽度；调整所述页面文档中固定区域的位置。本发明实施例主要用于页面的自适应过程中。
文档编号G06F17/30GK101908076SQ20101026190
公开日2010年12月8日 申请日期2010年8月24日 优先权日2010年8月24日
发明者蒋晟, 薛明, 郑小华 申请人:北京世纪高通科技有限公司