CN103744868A - 一种基于Web页面的显示方法、装置及浏览器 - Google Patents

Abstract

本发明提供一种基于Web页面的显示方法，包括：获取多个Web页面图像；生成透明的图层，且Web页面图像位于对应的图层上；在界面上设置立体显示空间；确定各个图层的坐标值；根据各个图层的坐标值将各个图层添加至立体显示空间中，以使图层上的Web页面图像显示在所述立体显示空间中。本发明还提供一种基于Web页面的显示装置及浏览器。通过为获取的Web页面图像生成透明图层，并将透明图层显示在显示界面的立体空间内，使Web页面图像的显示错落排列，具有立体显示效果，并通过实时随机更新每个图层的坐标值以更新每个Web页面图像的显示，使Web页面图像在显示空间内移动，增强显示效果，并便于使用者浏览Web页面信息。

Description

一种基于Web页面的显示方法、装置及浏览器

技术领域

本发明涉及Web页面的显示技术，特别是指一种基于Web页面的显示方法、装置及浏览器。

背景技术

随着计算机网络的发展，人们越来越依靠Web页面获取信息，Web页面可包括图形、文字、声音和视像等信息。另外，Web易于导航，只要从一个连接跳到另一个连接，就可以在网络的各站点之间进行浏览。虽然通过Web页面可以方便、快速地获得信息，但目前Web页面的显示方式却是单一的，并且通常是静态的，显示界面无法提供给使用者更加生动的显示界面，从而影响了使用者的使用。

如何使Web页面的显示更具生动性，是一个亟待解决的技术问题。

发明内容

本发明提供了一种基于Web页面的显示方法、装置及浏览器。所述技术方案如下：

第一方面，本发明提供了一种基于Web页面的显示方法，包括：

获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

在界面上设置立体显示空间；

按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

根据确定的各个图层的坐标值将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

其中，所述按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值，包括：

将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则，确定各个图层的z坐标；

按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

其中，所述方法还包括：

预设动态更新的周期；

当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；

根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

其中，所述根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值，包括：

在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。

其中，所述为每一个图层生成坐标变化参数，包括：

利用随机函数为所述每一个图层生成坐标变化参数。

其中，所述利用随机函数为所述每一个图层生成坐标变化参数，包括：

利用随机函数为所述每一个图层生成一随机数；

判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数。

其中，所述多个Web页面图像的大小均相同。

第二方面，本发明提供了一种基于Web页面的显示装置，包括：

获取模块，用于获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

图层生成模块，用于为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

空间设置模块，用于在界面上设置立体显示空间；

坐标值模块，用于按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

显示模块，用于根据确定的各个图层的坐标值，将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

其中，所述坐标值模块包括：

第一单元，用于将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则确定各个图层的z坐标；

第二单元，用于按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

其中，还包括：

周期设置模块，用于预设动态更新的周期；

所述坐标值单元还用于当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；

所述显示模块还用于根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

其中，所述坐标值模块还包括：

更新单元，用于在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。

其中，更新单元包括：

变化参数子单元，利用随机函数为所述每一个图层生成坐标变化参数。

其中，更新单元还包括：

生成子单元，利用随机函数为所述每一个图层生成一随机数；

判断子单元，用于判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数。

第三方面，本发明提供了一种浏览器，包括如上述任一所述的装置。

本发明提供的技术方案带来的有益效果是：通过为获取的Web页面图像生成透明图层，并将透明图层显示在显示界面的立体空间内，使Web页面图像的显示错落排列，具有立体显示效果，并通过实时随机更新每个图层的坐标值以更新每个Web页面图像的显示，使Web页面图像在显示空间内上下左右前后移动，从而使所述多个Web页面图像的显示呈现星空特效的立体显示，增强显示效果，并便于使用者浏览Web页面信息。

附图说明

为了更清楚地说明本发明实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的一种基于Web页面的显示方法的流程示意图；

图2为图1所示实施例中Web页面图像的星空特效显示示意图；

图3为图2所示示例中立体空间内坐标系示意图；

图4为本发明实施例提供的一种基于Web页面的显示装置的结构示意图；

图5为本发明实施例提供的一种基于Web页面的显示装置的另一结构示意图；

图6为图5所示装置中坐标值模块的结构示意图；

图7为图5所示装置中坐标值模块的另一结构示意图。

具体实施方式

为使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明实施方式作进一步地详细描述。参见图1，本发明实施例提供了一种基于Web页面的显示方法，包括以下步骤：

S100：获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

从每一个Web页面中提取一个Web页面图像，即通过Web页面图像标识相应的Web页面。

S200：为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

为每一个Web页面图像生成一个透明的图层，从而将要显示的多个Web页面图像形成在透明的图层上，由于Web页面图像形成在透明的图层上，从而避免Web页面图像之间的相互覆盖。

每一个Web页面图像位于对应的图层上，不同的Web页面图像分别与不同的图层建立对应关系。即，每一个Web页面图像对应一个图层。

通过将多个Web页面图像分别形成在不同的图层上，从而将要显示的多个页面图像同时显示在Web显示界面上。

通常，根据服务器的处理能力设置图层的最大数目，为了使服务器的处理能力最佳，通常该数目不大于120。

Web页面图像的大小可根据Web显示界面的的尺寸预先设定。

S300：在显示界面上设置立体显示空间；

在Web显示界面上，设置立体显示空间，即设置立体坐标系，确定该坐标系的原点O,X,Y和Z轴。

由立体显示空间的Z坐标值形成了图层在立体显示空间不同位置处的视觉效果。参见图2和图3，立体显示空间不同位置处的图层1、图层2和图层3的视觉效果为：图层1距离图层3更远，距离图层2较远。

S400：按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

通过将各个图层分布在立体坐标系的不同位置处，从而将多个Web页面图像显示在该坐标系内的不同位置上。

S500：根据确定的各个图层的坐标值将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

根据其不同X,Y和Z坐标值，将各个图层添加至所述立体显示空间中，从而使图层上的Web页面图像显示在立体显示空间中的不同位置上。

优选地，所述按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值，包括：

将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则，确定各个图层的z坐标；

按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

由于各个图层的X坐标值不同，立体显示空间中的Web页面图像在X和Y形成的平面内左右错开，同理，由于各个图层的Y坐标值不同，立体显示空间中的Web页面图像在X和Y形成的平面内上下错开，由于Z坐标值不同,立体显示空间中的Web页面图像在X、Y和Z形成的立体空间内前后错开，参见图2，形成了如图2所示的星空特效的立体显示。

通过将多个Web页面图像与Web显示界面所对应的各个图层建立对应关系，从而将多个Web页面图像显示在Web显示界面上，并通过在Web显示界面设置立体显示空间以及将各个图层设置在立体显示空间中不同位置上，从而使Web页面图像显示呈现具有星空特效的立体显示。

在立体显示空间中，参见图2和图3，Z轴坐标值不同的Web页面图像，随着坐标值的变换，Web页面图像的位置发生变化，从而使各个图层对应的所述多个Web页面图像在上、下、左、右、前、后各个方向上错落分布，类似视觉上的星空分布，呈现出如图2所示的星空特效排列。

优选地，所述方法还包括：预设动态更新的周期；当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

在预设的周期内，更新所述各个Web页面图像在所述立体显示空间中的位置，增强显示效果，并使使用者更容易找到所需要的信息。根据坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值，根据当前时刻的坐标值，在所述立体显示空间中显示各个Web页面图像。

优选地，所述各个图层在当前时刻的坐标值是通过在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。利用随机函数为所述每一个图层生成坐标变化参数。

如上所述，使用一随机数，例如random函数生成变化参数m,将检测获得的上一时刻的坐标值X,Y和Z增加m，形成了该Web页面图像在当前时刻的X,Y和Z坐标值，根据该当前时刻的X,Y和Z坐标值显示该Web页面图像。由此，在所述立体显示空间内更新显示所述多个Web页面图像。

变化参数m决定了该Web页面图像的更新，即移动，由于m为随机数，从而使所述多个Web页面图像在各个时刻的显示呈现出随机的移动特点。通过设置随机数满足的阈值范围，判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数，以使显示的Web页面图像的移动更平滑，稳定。

使用预先设定的阈值范围对m进行过滤，例如，第一阈值<<m<<第二阈值。如果m满足上述阈值范围，则将该随机数作为变化参数；否则，放弃该m值，利用random函数继续生成随机数m，之后，使用阈值范围对m再进行过滤，直到找到满足阈值范围的m值，将该m值作为变化参数。

根据过滤后得到的变化参数，对各个图层的X,Y和Z坐标值进行变化，得到各个图层在当前时刻的坐标值，依此类推，不断根据当前时刻的坐标值，更新显示Web页面图像，使Web页面图像在显示界面上上下左右前后移动，使移动更平滑，稳定。由于所述多个Web页面图像在Web页面显示空间内的位置随机变化，多个Web页面图像的立体显示因此更加丰富生动。

优选地，所述多个Web页面图像的大小均相同，当坐标值改变时，实时改变Web页面图像的显示大小，通过改变Web页面图像的显示大小，造成视觉空间上的距离感，参见图2，图层1相对图层3而言，其显示尺寸更小，相对图层2较小，从而在视觉上产生图层1距离图层3更远，距离图层2较远。

当坐标值改变时，通过改变Web页面图像的显示大小，造成视觉空间上的距离感，呈现出更具立体感的星空特效排列。

所述多个Web页面图像在立体显示空间中的位置，例如，可用图片的中心点的坐标值来表示。

本实施例提供的上述方法，通过为获取的Web页面图像生成透明图层，并将透明图层显示在显示界面的立体空间内，使Web页面图像的显示错落排列，具有立体显示效果，并通过实时随机更新每个图层的坐标值以更新每个Web页面图像的显示，使Web页面图像在显示空间内上下左右前后移动，从而使所述多个Web页面图像的显示呈现星空特效的立体显示，增强显示效果，并便于使用者浏览Web页面信息。

本发明的另一实施例提供一种基于Web页面的显示装置，参见图4，包括：

获取模块41，用于获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

图层生成模块42，用于为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

空间设置模块43，用于在界面上设置立体显示空间；

坐标值模块44，用于按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

显示模块45，用于根据确定的各个图层的坐标值，将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

优选地，参见图5，该装置还包括：

周期设置模块46，用于预设动态更新的周期；

坐标值模块44还用于当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；

显示模块45还用于根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

优选地，参见图6，坐标值模块44包括：

第一单元441，用于将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则确定各个图层的z坐标；

第二单元442，用于按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

优选地，参见图7，坐标值模块44还包括：

更新单元443，用于在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。

优选地，更新单元443包括：变化参数子单元，利用随机函数为所述每一个图层生成坐标变化参数。

优选地，更新单元443还包括：生成子单元，利用随机函数为所述每一个图层生成一随机数；判断子单元，用于判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数。

本实施例提供的上述装置可以执行上述方法实施例中提供的方法，详细过程见方法实施例中的描述，此处不赘述。

本实施例提供的上述装置，通过为获取的Web页面图像生成透明图层，并将透明图层显示在显示界面的立体空间内，使Web页面图像的显示错落排列，具有立体显示效果，并通过实时随机更新每个图层的坐标值以更新每个Web页面图像的显示，使Web页面图像在显示空间内上下左右前后移动，从而使所述多个Web页面图像的显示呈现星空特效的立体显示，增强显示效果，并便于使用者浏览Web页面信息。

本发明的另一实施例还提供一种浏览器，包括上述实施例所述的基于Web页面的显示装置，该装置的功能详见上述装置实施例中的描述，此处不赘述。

本实施例提供的所述浏览器可以执行上述方法实施例中提供的方法，详细过程见方法实施例中的描述，此处不赘述。

本实施例提供的上述浏览器，通过为获取的Web页面图像生成透明图层，并将透明图层显示在显示界面的立体空间内，使Web页面图像的显示错落排列，具有立体显示效果，并通过实时随机更新每个图层的坐标值以更新每个Web页面图像的显示，使Web页面图像在显示空间内上下左右前后移动，从而使所述多个Web页面图像的显示呈现星空特效的立体显示，增强显示效果，并便于使用者浏览Web页面信息。

本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成，也可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。

以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (14)

1.一种基于Web页面的显示方法，其特征在于，包括：

获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

在界面上设置立体显示空间；

按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

根据确定的各个图层的坐标值将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

2.根据权利要求1所述的显示方法，其特征在于，所述按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值，包括：

将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则，确定各个图层的z坐标；

按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

3.根据权利要求1所述的显示方法，其特征在于，所述方法还包括：

预设动态更新的周期；

当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；

根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

4.根据权利要求3所述的显示方法，其特征在于，所述根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值，包括：

在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。

5.根据权利要求3所述的显示方法，其特征在于，所述为每一个图层生成坐标变化参数，包括：

利用随机函数为所述每一个图层生成坐标变化参数。

6.根据权利要求5所述的显示方法，其特征在于，所述利用随机函数为所述每一个图层生成坐标变化参数，包括：

利用随机函数为所述每一个图层生成一随机数；

判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数。

7.根据权利要求1至6中任一项所述的显示方法，其特征在于，所述多个Web页面图像的大小均相同。

8.一种基于Web页面的显示装置，其特征在于，

获取模块，用于获取多个Web页面图像，其中每一个Web页面图像对应一个Web页面；

图层生成模块，用于为所述每一个Web页面图像生成一个透明的图层，且每一个Web页面图像位于对应的图层上；

空间设置模块，用于在界面上设置立体显示空间；

坐标值模块，用于按照任意两个图层坐标值不同的规则，确定各个图层在所述立体显示空间中的坐标值；

显示模块，用于根据确定的各个图层的坐标值，将各个图层添加至所述立体显示空间中，以使各个图层上的Web页面图像显示在所述立体显示空间中。

9.根据权利要求8所述的显示装置，其特征在于，所述坐标值模块包括：

第一单元，用于将图层划分为多个组，按照组内图层z坐标均相同但组间图层z坐标均不同的规则确定各个图层的z坐标；

第二单元，用于按照组内任意两个图层不重叠的规则，确定各个图层的x和y坐标。

10.根据权利要求8所述的显示装置，其特征在于，还包括：

周期设置模块，用于预设动态更新的周期；

所述坐标值单元还用于当所述周期到达时，为每一个图层生成坐标变化参数，并根据所述坐标变化参数与所述各个图层在上一时刻的坐标值，生成所述各个图层在当前时刻的坐标值；

所述显示模块还用于根据所述各个图层在当前时刻的坐标值，更新所述各个图层在所述立体显示空间中的位置，以使所述各个Web页面图像的位置在所述立体显示空间中进行更新。

11.根据权利要求10所述的显示装置，其特征在于，所述坐标值模块还包括：

更新单元，用于在所述各个图层上一时刻在x、y、z三个方向上的坐标值上分别叠加所述坐标变化参数，得到所述各个图层在当前时刻在x、y、z三个方向上的坐标值。

12.根据权利要求10所述的显示装置，其特征在于，更新单元包括：

变化参数子单元，利用随机函数为所述每一个图层生成坐标变化参数。

13.根据权利要求10所述的显示装置，其特征在于，更新单元还包括：

生成子单元，利用随机函数为所述每一个图层生成一随机数；

判断子单元，用于判断所述随机数是否满足预设的阈值范围，如果是，则将所述随机数作为对应的图层的坐标变化参数。

14.一种浏览器，其特征在于，包括如权利要求8-13任一所述的装置。

Images