CN103729106A - 网页缩略图展示方法和装置 - Google Patents

Abstract

一种网页缩略图展示方法，包括以下步骤：获取对标题栏向第一方向的拖动操作；根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图；获取对缩略图的触发操作；根据所述触发操作切换到所述缩略图对应的页面，且仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。此外，还提供了一种网页缩略图展示装置。上述网页缩略图展示方法和装置，获取拖动操作后，在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图，因将标签对应的网页页面的缩略图显示在预定区域，不需查看一次缩略图就进行一次拖动操作，简化操作，节省了操作次数，提高了操作效率。

Description

网页缩略图展示方法和装置

技术领域

本发明涉及网络交互技术，特别是涉及一种网页缩略图展示方法和装置。背景技术

目前的很多浏览器支持后台打开页面的功能。后台打开页面的功能是指在当前页面点击超级链接后，仍然保持显示当前页面的内容，不会跳转到超级链接所指的网页页面。后台打开多个页面后，会在界面上设置一个按钮控件，通过触发按钮控件，显示多个页面对应的网页缩略图，然后获取触发某个网页缩略图，页面会直接跳转到该触发的页面。其中，网页缩略图是指将正常大小的网页窗口按照一定的比例缩小后形成的图像。

然而，传统的浏览器上展示网页缩略图需要触发设置的按钮控件，且每次获取一个网页缩略图后，会跳转到对应的网页页面，若需要多次切换页面，需要每次触发按钮控件，操作不方便。

发明内容

基于此，有必要提供一种能简化操作，提高操作效率的网页缩略图展示方法。

一种网页缩略图展示方法，包括以下步骤：

获取对标题栏向第一方向的拖动操作；

根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图；

获取对缩略图的触发操作；

根据所述触发操作切换到所述缩略图对应的页面，且仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

此外，还有必要提供一种操作方便的网页缩略图展示系统。

一种网页缩略图展示装置，其特征在于，包括：

获取模块，用于获取对标题栏向第一方向的拖动操作；

显示模块，用于根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图；

触发模块，用于获取对缩略图的触发操作；

切换模块，用于根据所述触发操作切换到所述缩略图对应的页面；

所述显示模块还用于在所述切换模块根据触发操作切换到所述缩略图对应的页面后，仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

上述网页缩略图展示方法和装置，获取拖动操作后，在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图，因将标题栏中各个标签对应的各自网页页面的缩略图显示在预定区域，且在触发某一缩略图，切换到该缩略图对应的网页页面后，仍然显示各个标签所对应的各自网页页面的缩略图，不需查看一次缩略图就进行一次拖动操作，简化操作，节省了操作次数，提高了操作效率，且切换到缩略图对应页面，不需跳转，操作方便。

附图说明

图1为一个实施例中网页缩略图展示方法的流程示意图；

图2为浏览窗口的顶端部分设置标题栏区域的示意图；

图3为在浏览窗口的顶端部分显示多个网页页面缩略图的示意图；

图4为另一个实施例中网页缩略图展示方法的流程示意图；

图5为一个实施例中网页缩略图展示装置的内部结构示意图；

图6为另一个实施例中网页缩略图展示装置的内部结构示意图；

图7为另一个实施例中网页缩略图展示装置的内部结构示意图。

具体实施方式

下面结合具体的实施例及附图对网页缩略图展示方法和装置的技术方案进行详细的描述，以使其更加清楚。

如图1所示，在一个实施例中，一种网页缩略图展示方法，包括以下步骤：

步骤S 110，获取对标题栏向第一方向的拖动操作。

具体的，在浏览窗口上设有标题栏，该标题栏中至少包括一个标签。可对标题栏中任一标签进行拖动操作或对整个标题栏进行拖动操作。如图2所示，在浏览窗口10上的标题栏包括多个标签11，每个标签11对应一个网页页面12。本实施例中，标题栏设置在浏览窗口10的顶端部分，在其他实施例中，标题栏可设置在浏览窗口10的底端部分。为了方便说明，均采用标题栏设置在浏览窗口10的顶端部分为例进行描述。

在浏览窗口10的顶端部分设置标题栏，则第一方向为向下，即由顶端向底端方向。获取向下拖动标题栏中任意一个标签11的操作，则展示标签11对应的网页页面的缩略图。

在步骤S110之后，还包括步骤：检测该拖动操作的移动距离是否大于第一阈值，若是，则执行步骤S120。

具体的，获取拖动操作的移动距离，判断该移动距离是否大于第一阈值，若是，则根据拖动操作在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图。第一阈值可根据需要设定，如标题栏纵向长度的三分之二、三分之一等。

步骤S120，根据该拖动操作在浏览窗口的预定区域内显示该标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，如图3所示，在浏览窗口10设置预定区域14，当标题栏位于浏览窗口10的顶端部分时，预定区域14位于浏览窗口10的顶端部分，当标题栏位于浏览窗口10的底端部分时，预定区域14位于浏览窗口10的底端部分。本实施例中，预定区域14在浏览窗口10的顶端部分，且位于标题栏的上方，各个标签11对应的各自网页页面的缩略图13展示在预定区域14内。

步骤S130，获取对缩略图的触发操作。

具体的，在预定区域展示了标题栏中各个标签所对应的各自网页页面的缩略图后，可获取到用户通过鼠标或触摸屏等输入点击缩略图产生触发操作。

步骤S140，根据触发操作切换到缩略图对应的页面，且仍然在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，根据该点击缩略图的触发操作，直接切换到该缩略图对应的标签和页面，并显示该页面，且在浏览窗口的预定区域内仍然显示标题栏中各个标签所对应的各自网页页面的缩略图，以便下次触发缩略图进行页面切换。

上述网页缩略图展示方法，获取拖动操作后，在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图，因将标题栏中各个标签对应的各自网页页面的缩略图显示在预定区域，且在触发某一缩略图，切换到该缩略图对应的网页页面后，仍然显示各个标签所对应的各自网页页面的缩略图，不需查看一次缩略图就进行一次拖动操作，简化操作，节省了操作次数，提高了操作效率，且切换到缩略图对应页面，不需跳转，操作方便。

进一步的，在一个实施例中，在获取对标题栏向第一方向的拖动操作的步骤之后，还包括步骤：获取该标题栏中标签的个数；将浏览窗口的预定区域划分为与该标题栏中标签个数相同的展示区域，且该展示区域与该标题栏中标签一一对应。

具体的，将预定区域划分为与标题栏中标签个数相同的展示区域，如标题栏中标签为3个，则将预定区域划分为3个展示区域。一个标签对应一个展示区域。

步骤S 120具体包括：根据该拖动操作将该标题栏中各个标签所对应的各自网页页面的缩略图显示在该标题栏中各个标签所对应的各自展示区域内。具体的，一个标签对应一个展示区域，将标签对应的网页页面的缩略图展示在展示区域内。如图3所示，每个标签11对应的网页页面的缩略图13展示在标题栏上方对应的展示区域内。

此外，根据该拖动操作将该标题栏中各个标签所对应的各自网页页面的缩略图显示在该标题栏中各个标签所对应的各自展示区域内的步骤包括：当网页页面的缩略图的宽度大于该展示区域的宽度时，相邻的所述网页页面的缩略图进行层叠显示。具体的，当标题栏中标签的数量很多，预定区域被划分的展示区域的数量多，每个展示区域面积变小，网页页面的缩略图大小一定，网页页面的缩略图超出了展示区域面积的大小，相邻的网页页面的缩略图采用部分层叠方式显示。

如图4所示，在一个实施例中，一种网页缩略图展示方法，包括以下步骤：

步骤S210，获取对标题栏向第一方向的拖动操作。

具体的，在浏览窗口的顶端部分设置标题栏，则第一方向为向下，即由顶端向底端方向；在浏览窗口的底端部分设置标题栏，则第一方向为向上，即由底端向顶端方向。

步骤S220，根据该拖动操作在浏览窗口的预定区域内显示该标题栏中各个标签所对应的各自网页页面的缩略图。

步骤S230，获取对缩略图的触发操作。

具体的，在预定区域展示了标题栏中各个标签所对应的各自网页页面的缩略图后，可获取到用户通过鼠标或触摸屏等输入点击缩略图产生触发操作。

步骤S240，根据触发操作切换到缩略图对应的页面，且仍然在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，根据该点击缩略图的触发操作，直接切换到该缩略图对应的标题栏和页面，并显示该页面。

步骤S250，获取对标题栏向该第二方向的拖动操作。

具体的，第一方向为向下，则第二方向是指向上，同样，第一方向为向上，则第二方向是指向下，即第一方向与第二方向相反。本实施例中，如图3所示，第二方向为向上，该拖动操作为对标题栏中一标签的拖动操作。

在一个实施例中，在步骤S250之后，还包括步骤：检测该拖动操作的移动距离是否大于第二阈值，若是，则根据该拖动操作隐藏该标题栏中各个标签所对应的各自网页页面的缩略图，若否，则继续显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，第二阈值可根据需要设定，如标题栏纵向长度的三分之二、三分之一等。

步骤S260，根据拖动操作隐藏该标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，标题栏中某一标签被拖动，整个标题栏移动覆盖预定区域，隐藏标题栏中各个标签所对应的各自网页页面的缩略图。

上述网页缩略图展示方法，根据对标题栏向第二方向的拖动操作，可隐藏标签对应的缩略图，减小缩略图所占有的页面空间。

如图5所示，在一个实施例中，一种网页缩略图展示装置，包括获取模块110、显示模块120、触发模块130和切换模块140。其中：

获取模块110用于获取对标题栏向第一方向的拖动操作。

具体的，在浏览窗口上设有标题栏，该标题栏中至少包括一个标签。可对标题栏中任一标签进行拖动操作或对整个标题栏进行拖动操作。如图2所示，在浏览窗口10上的标题栏包括多个标签11，每个标签11对应一个网页页面12。本实施例中，标题栏设置在浏览窗口10的顶端部分，在其他实施例中，标题栏可设置在浏览窗口10的底端部分。为了方便说明，均采用标题栏设置在浏览窗口10的顶端部分为例进行描述。

在浏览窗口10的顶端部分设置标题栏，则第一方向为向下，即由顶端向底端方向。获取向下拖动标题栏中任意一个标签11的操作，则展示标签11对应的网页页面的缩略图。

显示模块120用于根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，如图3所示，在浏览窗口10设置预定区域，当标题栏位于浏览窗口10的顶端部分时，预定区域位于浏览窗口10的顶端部分，当标题栏位于浏览窗口10的底端部分时，预定区域14位于浏览窗口10的底端部分。本实施例中，预定区域在浏览窗口10的顶端部分，且位于标题栏的上方，每个标签11对应的网页页面的缩略图13展示在预定区域14内。

触发模块130用于获取对缩略图的触发操作。

具体的，在预定区域展示了标题栏中各个标签所对应的各自网页页面的缩略图后，可获取到用户通过鼠标或触摸屏等输入点击缩略图产生触发操作。

切换模块140用于根据触发操作切换到缩略图对应的页面。

显示模块120还用于在切换模块140根据触发操作切换到缩略图对应的页面后，仍然在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图。

具体的，根据该点击缩略图的触发操作，直接切换到该缩略图对应的标签和页面，并显示该页面，且在浏览窗口的预定区域内仍然显示标题栏中各个标签所对应的各自网页页面的缩略图，以便下次触发缩略图进行页面切换。

上述网页缩略图展示装置，获取模块110获取拖动操作后，显示模块120在浏览窗口10的预定区域14内显示标题栏中各个标签所对应的各自网页页面的缩略图13，因将每个标签11对应的网页页面的缩略图13显示在预定区域14，且在触发模块130获取到触发某一缩略图，切换模块140切换到该缩略图对应的网页页面后，显示模块120仍然显示各个标签所对应的各自网页页面的缩略图，不需查看一次缩略图就进行一次拖动操作，简化操作，节省了操作次数，提高了操作效率，且切换到缩略图对应页面，不需跳转，操作方便。

如图6所示，在一个实施例中，一种网页缩略图展示装置，除了包括获取模块110、显示模块120、触发模块130和切换模块140，还包括第一检测模块150、第二检测模块160和隐藏模块170。其中：

第一检测模块150用于在获取模块110获取对标题栏向第一方向的拖动操作之后，检测所述拖动操作的移动距离是否大于第一阈值。具体的，第一检测模块130获取拖动操作的移动距离，判断该移动距离是否大于第一阈值，若是，则根据拖动操作在浏览窗口的预定区域内显示标题栏中各个标签所对应的各自网页页面的缩略图。第一阈值可根据需要设定，如标题栏纵向长度的三分之二、三分之一等。

显示模块120用于在检测到所述拖动操作的移动距离大于第一阈值，根据该拖动操作在浏览窗口的预定区域内显示该标题栏所对应的网页页面的缩略图。

触发模块130用于获取对缩略图的触发操作。具体的，在预定区域展示了标题栏中各个标签所对应的网页页面的缩略图后，可获取到用户通过鼠标或触摸屏等输入点击缩略图产生触发操作。

切换模块140用于根据所述触发操作切换到所述缩略图对应的页面。具体的，切换模块140根据该点击缩略图的触发操作，直接切换到该缩略图对应的标题栏和页面，并显示该页面。

获取模块110获取对标题栏向第二方向的拖动操作。具体的，第一方向为向下，则第二方向是指向上，同样，第一方向为向上，则第二方向是指向下，即第一方向与第二方向相反。

第二检测模块160用于在获取对标题栏向第二方向的拖动操作之后，检测该拖动操作的移动距离是否大于第二阈值。具体的，第二阈值可根据需要设定，如标题栏纵向长度的三分之二、三分之一等。

隐藏模块170用于根据获取模块110获取到的拖动操作隐藏该标题栏中各个标签所对应的各自网页页面的缩略图。具体的，标题栏中某一标签被拖动，整个标题栏移动覆盖预定区域，隐藏标题栏中各个标签所对应的各自网页页面的缩略图。

此外，在其他实施例中，网页缩略图展示装置可仅包括获取模块110、显示模块120、触发模块130切换模块140、第一检测模块150、第二检测模块160和隐藏模块170所有可能的组合，如仅包括获取模块110、显示模块120、第一检测模块150、触发模块130和切换模块140。

上述网页缩略图展示装置，根据对标题栏向第二方向的拖动操作，可隐藏标签对应的缩略图，减小缩略图所占有的页面空间。

如图7所示，在一个实施例中，一种网页缩略图展示装置，除了包括获取模块110、显示模块120、触发模块130和切换模块140，还包括划分模块180和层叠模块190。其中：

获取模块110还用于获取该标题栏中标签的个数。

划分模块180用于将所述浏览窗口的预定区域划分为与所述标题栏中标签个数相同的展示区域，且所述展示区域与所述标题栏中标签一一对应。具体的，划分模块180将预定区域划分为与标题栏中标签个数相同的展示区域，如标题栏中标签为3个，则将预定区域划分为3个展示区域。一个标签对应一个展示区域。

显示模块120还用于根据该拖动操作将所述标题栏中各个标签所对应的各自网页页面的缩略图显示在该标题栏中各个标签所对应的各自展示区域内。具体的，一个标签对应一个展示区域，将标题栏中各个标签对应的各自网页页面的缩略图展示各个标签所对应的各自展示区域内。如图3所示，每个标签对应的网页页面的缩略图展示在标题栏上方对应的展示区域内。

层叠模块190用于当网页页面的缩略图的宽度大于所述展示区域的宽度时，相邻的所述网页页面的缩略图进行层叠显示。具体的，当标题栏中标签的数量很多，预定区域被划分的展示区域的数量多，每个展示区域面积变小，网页页面的缩略图大小一定，网页页面的缩略图超出了展示区域面积的大小，相邻的网页页面的缩略图采用部分层叠方式显示。

在其他实施例中，网页缩略图展示装置可仅包括获取模块110、显示模块120、触发模块130、切换模块140和划分模块180。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的程序可存储于一计算机可读取存储介质中，该程序在执行时，可包括如上述各方法的实施例的流程。其中，所述的存储介质可为磁碟、光盘、只读存储记忆体（Read-Only Memory，ROM）或随机存储记忆体（Random Access Memory，RAM）等。

以上所述实施例仅表达了本发明的几种实施方式，其描述较为具体和详细，但并不能因此而理解为对本发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护范围。因此，本发明专利的保护范围应以所附权利要求为准。

Claims (12)

1.一种网页缩略图展示方法，包括以下步骤：

获取对标题栏向第一方向的拖动操作；

根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图；

获取对缩略图的触发操作；

根据所述触发操作切换到所述缩略图对应的页面，且仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

2.根据权利要求1所述的网页缩略图展示方法，其特征在于，在根据所述触发操作切换到所述缩略图对应的页面，且仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图的步骤之后，还包括步骤：

获取对标题栏向第二方向的拖动操作；

根据所述拖动操作隐藏所述标题栏中各个标签所对应的各自网页页面的缩略图。

3.根据权利要求1所述的网页缩略图展示方法，其特征在于，在所述获取对标题栏向第一方向的拖动操作的步骤之后，还包括步骤：

检测所述拖动操作的移动距离是否大于第一阈值，若是，则根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

4.根据权利要求2所述的网页缩略图展示方法，其特征在于，在所述获取对标题栏向第二方向的拖动操作的步骤之后，还包括步骤：

检测所述拖动操作的移动距离是否大于第二阈值，若是，则根据所述拖动操作隐藏所述标题栏中各个标签所对应的各自网页页面的缩略图，若否，则继续显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

5.根据权利要求1所述的网页缩略图展示方法，其特征在于，在所述获取对标题栏向第一方向的拖动操作的步骤之后，还包括步骤：

获取所述标题栏中标签的个数；

将所述浏览窗口的预定区域划分为与所述标题栏中标签个数相同的展示区域，且所述展示区域与所述标题栏中标签一一对应；

根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图的步骤包括：

根据所述拖动操作将所述标题栏中各个标签所对应的各自网页页面的缩略图显示在所述标题栏中各个标签所对应的各自展示区域内。

6.根据权利要求5所述的网页缩略图展示方法，其特征在于，所述根据所述拖动操作将所述标题栏中各个标签所对应的各自网页页面的缩略图显示在所述标题栏中各个标签对应的各自展示区域内的步骤包括：

当网页页面的缩略图的宽度大于所述展示区域的宽度时，相邻的所述网页页面的缩略图进行层叠显示。

7.一种网页缩略图展示装置，其特征在于，包括：

获取模块，用于获取对标题栏向第一方向的拖动操作；

显示模块，用于根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图；

触发模块，用于获取对缩略图的触发操作；

切换模块，用于根据所述触发操作切换到所述缩略图对应的页面；

所述显示模块还用于在所述切换模块根据触发操作切换到所述缩略图对应的页面后，仍然在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

8.根据权利要求7所述的网页缩略图展示装置，其特征在于，还包括隐藏模块，所述获取模块还用于获取对标题栏向第二方向的拖动操作；所述隐藏模块用于根据所述获取模块获取到的拖动操作隐藏所述标题栏中各个标签所对应的各自网页页面的缩略图。

9.根据权利要求7所述的网页缩略图展示装置，其特征在于，还包括：

第一检测模块，用于在获取对标题栏向第一方向的拖动操作之后，检测所述拖动操作的移动距离是否大于第一阈值；

所述显示模块用于在检测到所述拖动操作的移动距离大于第一阈值，根据所述拖动操作在浏览窗口的预定区域内显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

10.根据权利要求8所述的网页缩略图展示装置，其特征在于，还包括：

第二检测模块，用于在获取对标题栏向第二方向的拖动操作之后，检测所述拖动操作的移动距离是否大于第二阈值；

所述隐藏模块还用于在检测到拖动操作的移动距离大于第二阈值时，根据所述拖动操作隐藏所述标题栏中各个标签所对应的各自网页页面的缩略图；

所述显示模块还用于在检测到拖动操作的移动距离不大于第二阈值时，继续显示所述标题栏中各个标签所对应的各自网页页面的缩略图。

11.根据权利要求7所述的网页缩略图展示装置，其特征在于，还包括划分模块；

所述获取模块还用于获取所述标题栏中标签的个数；

所述划分模块用于将所述浏览窗口的预定区域划分为与所述标题栏中标签个数相同的展示区域，且所述展示区域与所述标题栏中标签一一对应；

所述显示模块还用于根据所述拖动操作将所述标题栏中各个标签所对应的各自网页页面的缩略图显示在所述标题栏中各个标签所对应的各自展示区域内。

12.根据权利要求11所述的网页缩略图展示装置，其特征在于，还包括：

层叠模块，用于当网页页面的缩略图的宽度大于所述展示区域的宽度时，相邻的所述网页页面的缩略图进行层叠显示。

Images