CN102981876B - 图片工具条窗口加载方法和装置 - Google Patents

Abstract

本发明公开了一种图片工具条窗口加载方法和装置，该装置包括：生成与获取模块；监测与获取模块；判断与发送模块；创建与显示模块；其中，当启动浏览器时生成所述浏览器主进程，所述浏览器主进程对应一个或多个网页子进程，所述浏览器主进程的图片工具条窗口在所述一个或多个网页子进程之间交互使用。本发明中，解决了在浏览器中执行图片元素的相关处理时出现对其图片工具条窗口的加载误判现象。

Description

图片工具条窗口加载方法和装置

技术领域

本发明属于互联网技术领域，具体地说，涉及一种图片工具条窗口加载方法和装置。

背景技术

浏览器是最经常使用到的客户端程序，借助浏览器可以显示从网页服务器或者文件系统获取的超文本标记语言（HypertextMarkupLanguage，以下简称：HTML）文件内容，并便于用户与获取的HTML文件进行交互。其中，从网页服务器获取HTML文件的浏览器即网页浏览器，个人电脑上常见的网页浏览器包括微软的InternetExplorer、Mozilla的Firefox、Apple的Safari，Opera、GoogleChrome、GreenBrowser浏览器、360安全浏览器、搜狗高速浏览器、天天浏览器、腾讯TT、傲游浏览器、百度浏览器、腾讯QQ浏览器等。

网页浏览器的工作原理可概括为：通过HTTP协议与网页服务器交互并获取HTML文件并以网页的形式呈现给用户，这些网页文件格式通常为HTML，并由多用途网际网路邮件延伸标准（MultipurposeInternetMailExtensions，MIME）在HTTP协议中指明，并通过统一资源定位符（Uniform/UniversalResourceLocator，以下简称URL）进行指定。许多浏览器还支持其他的URL类型及其相应的协议，如FTP、Gopher、HTTPS（HTTP协议的加密版本）。HTTP内容类型和URL协议规范允许网页设计者在网页中嵌入图像、动画、视频、声音、流媒体等网页元素。目前，大部分的浏览器本身还支持除HTML之外的广泛的格式，例如JPEG、PNG、GIF等图片格式，并且能够扩展支持众多的插件（plug-ins），网页中每个文档都是分别从网页服务器获取。

以在网页中显示图片为例，网页中都会设置针对该图片的图片工具条，通过操作该工具条，实现图片的全屏显示、图片的切换、图片的缩放等。

现有的图片工具条的加载是在当前网页页面进程中完成，使用当前网页中的javascript脚本生成DIV层的弹窗，在弹窗中加载有工具条，以呈现工具条。但是，而且经常在图片上会浮动有一些DIV或者子框，比如显示标题或者增强图像的显示效果的子框。此时，对于检测光标的移入移出和移动而进行窗口的生成就会出现误差，因为当光标移动到上述DIV或者子框上时，DIV或者子框下的图片会产生Mouse-out事件，其实光标还在图片上，这就会导致误判。例如，在网页中针对某一图片产生工具条，而该图片上有一子框“下一页....”，当光标移动到该子框时，光标其实还处于图片上，但是此时会出现Mouse-out事件的误判，误认为光标已移出图片，会导致图片工具条窗口的隐藏。

所以，目前迫切需要本领域解决的一个技术问题就是：提供一种图片工具条窗口加载的处理方案，解决在浏览器中执行图片元素的相关处理时出现对其图片工具条窗口的加载误判现象。

发明内容

鉴于上述问题，提出了本发明以便提供一种图片工具条窗口加载方法和装置，用以解决在浏览器中执行图片元素的相关处理时出现对其图片工具条窗口的加载误判现象。

根据本发明的一个方面，提供了一种图片工具条窗口加载方法，该方法包括：

在网页子进程中打开网页标签，并获取网页中图片元素的位置信息；

在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；

浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口；

当启动浏览器时生成所述浏览器主进程，所述浏览器主进程对应一个或多个网页子进程，所述浏览器主进程的图片工具条窗口在所述一个或多个网页子进程之间交互使用。

优选地，在本发明的方法中，所述在网页子进程中打开网页标签，并获取网页中图片元素的位置信息包括：

当前所述网页子进程遍历网页中的图片元素的位置信息和属性信息；以及

将所述图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

优选地，在本发明的方法中，所述图片元素的位置信息包括：

所述图片元素在当前所述网页子进程的页面可见区域中的左上角位置坐标和所述图片元素的宽和高；以及

所述图片元素的属性信息包括：图片大小、图片在本地缓存的地址、图片在云端的保存地址和/或所述图片元素的URL。

优选地，在本发明的方法中，所述图片元素的输入选择事件包括如下任一种事件：

鼠标悬浮事件、鼠标移入事件、鼠标移动事件、触摸按下事件、触摸移动事件、触摸长按事件、触摸滑动事件、键盘选定。

优选地，在本发明的方法中，所述依据所述图片元素的位置信息获得所述图片元素的显示区域信息包括：

获取并将当前的屏幕坐标转换到浏览器的页面可见区域中；

依据浏览器的页面可见区域的当前的屏幕坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息。

优选地，在本发明的方法中，所述浏览器主进程依据所述判断结果，并依据所述图片元素的位置信息在指定位置处创建/隐藏图片工具条窗口包括：

当前光标的位置在所述图片元素的显示区域中时，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口；

否则，在指定位置处创建并隐藏图片工具条窗口。

优选地，在本发明的方法中，所述判断当前光标的位置是否在所述图片元素的显示区域中包括：

将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

优选地，在本发明的方法中，所述在网页子进程中打开网页标签，并获取网页中图片元素的位置信息包括：

当前所述网页子进程遍历网页中的所有图片元素的位置信息和属性信息；以及

按照遍历的先后顺序，将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

优选地，在本发明的方法还包括：

获取当前光标所在的图片的标题或URL信息，与所述遍历的图片元素的属性信息进行预先匹配；

获取到所述匹配的图片元素，然后获取当前光标的位置信息并与所述匹配图片元素的显示区域信息比较，判断当前光标的位置是否在所述匹配图片元素的显示区域中，将判断结果和所述匹配图片元素的位置信息通知到所述浏览器的主进程。

优选地，在本发明的方法中，所述指定位置为所述图片元素区域内的任一位置；或者为所述图片元素边缘处的一位置。

根据本发明的另一个方面，提供了一种图片工具条窗口加载装置，该装置包括：

生成与获取模块，用于在网页子进程中打开网页标签，并获取网页中图片元素的位置信息；

监测与获取模块，用于在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

判断与发送模块，用于获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；

创建与显示模块，用于浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口；

其中，当启动浏览器时生成所述浏览器主进程，所述浏览器主进程对应一个或多个网页子进程，所述浏览器主进程的图片工具条窗口在所述一个或多个网页子进程之间交互使用。

优选地，在本发明的装置中，生成与获取模块包括：

遍历子模块，用于当前所述网页子进程遍历网页中的图片元素的位置信息和属性信息；以及

缓存子模块，用于将所述图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

优选地，在本发明的装置中，监测与获取模块还被配置成：

获取并将当前的屏幕坐标转换到浏览器的页面可见区域中；

依据浏览器的页面可见区域的当前的屏幕坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息。

优选地，在本发明的装置中，创建与显示模块还被配置成：

当前光标的位置在所述图片元素的显示区域中时，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口；

否则，在指定位置处创建并隐藏图片工具条窗口。

优选地，在本发明的装置中，判断与发送模块还被配置成：

将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

优选地，在本发明的装置中，生成与获取模块包括：

遍历子模块，用于当前所述网页子进程遍历网页中的所有图片元素的位置信息和属性信息；以及

缓存子模块，用于按照遍历的先后顺序，将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

优选地，在本发明的装置中，判断与发送模块还被配置成：

获取当前光标所在的图片的标题或URL信息，与所述遍历的图片元素的属性信息进行预先匹配；

获取到所述匹配的图片元素，然后获取当前光标的位置信息并与所述匹配图片元素的显示区域信息比较，判断当前光标的位置是否在所述匹配图片元素的显示区域中，将判断结果和所述匹配图片元素的位置信息通知到所述浏览器的主进程。

与现有的方案相比，本发明的有益效果为：提出了一种基于浏览器侧对网页图片元素进行处理的方案，在浏览器主进程中建立对一个或多个网页标签中的图片元素处理的机制，提高了在浏览器侧进行图片元素处理的效率，避免了对网页子进程图片工具条的操作出现的误判问题以及浏览器崩溃等问题；并且一个浏览器主进程可以对应一个或多个网页子进程，浏览器主进程创建的图片工具条窗口可以在多个网页子进程之间交互使用，减少了网页子进程生成图片工具条窗口的负担，同时提高了图片工具条的使用效率。

上述说明仅是本发明技术方案的概述，为了能够更清楚了解本发明的技术手段，而可依照说明书的内容予以实施，并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示意性示出了根据本发明一个实施例的图片工具条窗口加载方法的流程图；

图2示意性示出了根据本发明一个实施例的图片工具条窗口加载方法的详细流程图；

图3示意性示出了根据本发明一个实施例的图片工具条窗口加载装置的模块图。

图4示意性示出了根据本发明一个实施例的的图片工具条窗口加载方法的流程图；

图5示意性示出了根据本发明一个实施例的隐藏图片工具条窗口的流程示意图；

图6示意性示出了根据本发明一个实施例的图片工具条窗口加载方法针对的一网页示意图；

图7示意性示出了根据本发明一个实施例的图片工具条窗口加载方法中避免误判的详细流程示意图。

具体实施方式

下面结合附图和具体的实施方式对本发明作进一步的描述。

本发明的主要思想在于，在网页子进程中打开网页标签，并获取网页中图片元素的位置信息；在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口。

为使本发明的目的、技术方案和优点更加清楚，以下结合附图及具体实施例，对本发明作进一步地详细说明。

根据本发明的实施例，提供了一种图片工具条窗口加载方法。

图1示意性示出了根据本发明一个实施例的图片工具条窗口加载方法的流程图，该方法可以包括以下步骤。

在步骤S201处，在网页子进程中打开网页标签，并获取网页中图片元素的位置信息。

在本发明实施例中，当浏览器启动时，浏览器主进程自动启动，并在网页子进程中打开网页标签，特别的，一个浏览器主进程可以对应一个或者多个网页子进程。

当网页标签被打开时，当前所述网页子进程遍历网页中的图片元素的位置信息和属性信息，并将所述图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

或者，当网页标签被打开时，当前所述网页子进程遍历网页中的所有图片元素的位置信息和属性信息，并按照遍历的先后顺序，将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。例如：当前网页是第一张显示图片的网页，其第二页中的图片也是可以在全屏实现当前网页时，在缓存中获取第二页中的图片信息，并预显在全屏窗口中的，尤其对于当前网页图片是一个系列时，通过这种技术处理，会在对当前页面中的图片进行全屏显示时或者在子进程通知主进程时就开始进行其它图片的下载，该要下载的图片是在主进程收到来自子进程的通知时，就由子进程中网页中的JS代码获取的上/下一张图片的图片信息，一起通知到主进程，在主进程需要进一步的后续图片时，也会向网页子进程中获取进一步的图片信息或者主进程主动向该图片的URL获取网页中的下一张图片，在主进程的进行后一或者前一图片的下载，在用户点击前一或者后一图片时在主进程中进行下载图片在该全屏显示窗口中的显示。

在步骤S202处，在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

在步骤S203处，获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；

需要说明的是，在将所述图片元素的位置信息向浏览器主进程发送的同时，也将所述图片元素的属性信息向浏览器主进程发送，所述浏览器主进程接收网页子进程发送的位置信息和属性信息。

在步骤S204处，浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口。

依据所述图片元素的属性信息，通过所述浏览器主进程所创建的所述图片工具条窗口进行所述图片元素的处理。图片元素的处理可以包括：图片元素的本地保存、分享、全屏显示、URL网络保存和上传至指定网站等。所述浏览器主进程在指定位置处创建或显示或隐藏图片工具条窗口，其中的指定位置是依据所述图片元素的位置信息而定的，其可以是在图片元素的周边，也可以是在图片元素显示范围之中，也可以是浏览器中的网页标签显示区域中的任一有用户设置的窗口区域中，例如网页标签显示区域窗口的一个分拆子窗口。上述的图片处理对应的图标被加载在上述的图片工具条窗口中，在接收用户对上述图标的点选后，激活对应的图片处理。

图2示意性示出了根据本发明一个实施例的图片工具条窗口加载方法的详细流程图，具体可以包括以下步骤。

在步骤S301处，启动浏览器，生成浏览器主进程。

在步骤S302处，在网页子进程中打开网页标签。

当网页标签被加载时，网页子进程执行遍历网页中的图片元素的JS脚本，并通过浏览器辅助对象技术（BHO技术）实现步骤S303。

在步骤S303处，网页子进程获取网页中图片元素的位置信息和属性信息。

当网页标签加载时被嵌入一段JS代码，目的是遍历网页中的图片元素的位置信息和属性信息，并且将上述图片元素的位置信息和属性信息上传到网页子进程的缓存中。

其中，所述图片元素的位置信息可以包括但不限于：所述图片元素在所述当前网页子进程的页面可见区域中的左上角位置坐标和所述图片元素的宽和高等等；属性信息可以包括但不限于：图片大小、图片在本地缓存的地址、图片在云端的保存地址和/或所述图片元素的URL等等。

在步骤S304处，网页子进程缓存存储所述图片元素的位置信息和属性信息。

在步骤S305处，在所述当前网页子进程中监测对所述图片元素的输入选择事件。

本发明中有输入选择事件的网页元素是图片元素，对图片元素进行监测，监测的同时执行步骤S306，对监测结果做出判断。

在步骤S306处，判断是否有输入选择事件。

当确定有输入选择事件时，执行步骤S307，否则返回去执行步骤S305。

所述输入选择事件可以包括如下任一种事件：鼠标悬浮事件、鼠标移入事件、鼠标移动事件、触摸按下事件、触摸移动事件、触摸长按事件、触摸滑动事件、键盘选定。

在步骤S307处，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

需要说明的是，在执行步骤S307时，可以通过获取并将当前的屏幕坐标转换到浏览器的页面可见区域中，并依据浏览器的页面可见区域的当前的屏幕坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息。

在步骤S308处，获取当前光标的位置信息；

在获取到当前光标的位置信息时，执行步骤S309；

在步骤309处，判断当前光标的位置是否在所述图片元素的显示区域；

需要说明的是，在执行步骤309时，可以将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；并依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

或者，可以获取当前光标所在的图片的标题或URL信息，与所述遍历的图片元素的属性信息进行预先匹配，并获取到所述匹配的图片元素，然后获取当前光标的位置信息并与所述匹配图片元素的显示区域信息比较，判断当前光标的位置是否在所述匹配图片元素的显示区域中。

当确定当前光标的位置在所述图片元素的显示区域中时，执行步骤310，否则，执行步骤311；

在步骤310处，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口；

需要说明的是，步骤310中，是针对当判定当前光标的位置在所述图片元素的显示区域中时所执行的。

该图片工具条窗口由浏览器主进程生成，可以在不同网页子进程之间复用，在不同的网页子进程中，图片工具条窗口的位置可以根据图片元素的位置信息来确定。

所述指定位置可以为所述图片元素区域内的任一位置；或者为所述图片元素边缘处的一位置。

该图片工具条窗口由浏览器主进程生成，可以在不同网页子进程之间复用，在不同的网页子进程中，图片工具条窗口的位置可以根据图片元素的位置信息来确定。

在步骤311处，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并隐藏图片工具条窗口。

需要说明的是，是针对当判定当前光标的位置不在所述图片元素的显示区域中时所执行的。

所述指定位置可以为所述图片元素区域内的任一位置；或者为所述图片元素边缘处的一位置。

该图片工具条窗口由浏览器主进程生成，可以在不同网页子进程之间复用，在不同的网页子进程中，图片工具条窗口的位置可以根据图片元素的位置信息来确定。

本发明还提供了一种图片工具条窗口加载装置，参照图3，示意性示出了根据本发明一个实施例的图片工具条窗口加载装置的模块图。

根据本发明的装置，可以包括生成与获取模块401、监测与获取模块402、判断与发送模块403、创建与显示模块404。

生成与获取模块401，用于在网页子进程中打开网页标签，并获取网页中图片元素的位置信息。

当浏览器被启动时，生成与获取模块401自动启动一个浏览器主进程，并在网页子进程中打开网页标签，一个浏览器主进程对应一个或多个网页子进程。

同时，生成与获取模块401还包括遍历子模块411和缓存子模块421。当网页标签被打开时，遍历子模块411遍历网页中图片元素的位置信息和属性信息，并将所述图片元素的位置信息和属性信息发送给缓存子模块421进行保存。或者，当网页标签被打开时，遍历子模块411遍历网页中的所有图片元素的位置信息和属性信息，并将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息发送给缓存子模块421按照遍历的先后顺序进行保存。

监测与获取模块402，用于在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

判断与发送模块403，用于获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；

监测到对所述图片元素的输入选择事件时，并定当前光标的位置在所述图片元素的显示区域中，并通知创建与显示模块404在指定位置处创建或显示图片工具条窗口。否则的话，通知创建与显示模块404在指定位置处隐藏图片工具条窗口，但保留所述图片元素的位置信息，当再次监测到该图片元素有输入选择事件时，通知创建与显示模块403显示处于隐藏状态的图片工具条窗口。

判断与发送模块403向所述浏览器的主进程通知所述图片元素的位置信息时，也向浏览器主进程通知所述图片元素的属性信息。

创建与显示模块404，用于浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口。

由于一个浏览器主进程只创建一个图片工具条窗口，所以实现了图片工具条在各个网页子进程中的复用。

如图4所示，示意性示出了根据本发明一个实施例的的图片工具条窗口加载方法的流程图，本实施中，从系统架构的角度，对家在图片工具条的方法进行说明。具体地，该方法可以包括以下步骤。

在步骤S501处，在当前网页子进程中打开网页标签，并获取网页中图片元素的位置信息；

在步骤S502处，在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

在步骤S503处，获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到所述浏览器的主进程；

在步骤S504处，浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口。

上述步骤S501-S504中，记载的针对当前网页子进程中的网页中的图片元素，生成图片工具条窗口，与上述图1所述的内容类似，在此不再赘述。

在步骤S505处，在另一网页子进程中打开另一网页标签，获取该网页中图片元素的位置信息；

类似地，由于一个浏览器主进程可以对应多个网页子进程，因此，在浏览器主进程启动后，并根据当前网页子进程已经生成过图片工具条窗口后，可以在网页主进程对应的打开另外一网页子进程。

在步骤S506处，在另一网页子进程中监测到对其对应网页中图片元素的输入选择事件时，依据该图片元素的位置信息获得所述图片元素的显示区域信息；

上述步骤S505-S506的详细过程可参见实施例一中针对当前网页子进程的处理过程，在此不再赘述。

在步骤S507处，获取当前光标的位置信息并与另一网页子进程中监测到对其对应网页中图片元素的显示区域信息比较，判断当前光标的位置是否在该图片元素的显示区域中，将判断结果和该图片元素的位置信息通知到所述浏览器的主进程；

在步骤S508处，浏览器主进程将所述图片元素的位置信息发送到步骤S504中已创建的图片工具条窗口，并依据所述判断结果在指定位置处显示或隐藏图片工具条窗口。

图4所示的实施例，也可以适用于基于同一浏览器主进程打开多个网页子进程的情况，在此不再赘述。

如图5所示，示意性示出了根据本发明一个实施例的隐藏图片工具条窗口的流程示意图。其可以具体包括：在步骤S601处，获取并将当前的屏幕坐标转换到浏览器的页面可见区域中；

在步骤S602处，依据浏览器的页面可见区域的当前的屏幕坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息；

需要说明的是，所述图片元素的显示区域信息是指当前网页中的client区域。

在步骤S603处，获取当前光标的位置信息并将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

在步骤S604处，依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中；

如果光标的位置在所述图片元素的显示区域，则执行步骤S605，否则执行步骤S606。

在步骤S605处，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口。

在步骤606中，判断是否有取消选择事件；

需要说明的是，所述图片元素的取消选择事件包括但不局限于鼠标移出事件、触摸弹起事件、键盘取消等等。

如果有取消选择事件，则执行步骤S607；否则，继续执行步骤S605。

在步骤607处，浏览器主进程在制定位置处创建并隐藏图片工具条窗口。

如图6所示，示意性示出了根据本发明一个实施例的图片工具条窗口加载方法针对的一网页示意图，其中网页中的一图片元素1位于网页中的可显示区域client区域2，同时位于屏幕3上，光标4如图所示的位置，图片元素1上有一子框5。如图7所示，为示意性示出了根据本发明一个实施例的图片工具条窗口加载方法中避免误判的详细流程示意图。当光标移动到图6所示的图片上时，其可以具体包括：

在步骤701处，获取当前光标的位置信息并将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

需要说明的是，由于打开网页时，图6中的光标一方面位于屏幕的坐标中，一方面又位于网页页面定义的可见区域client区域中，因此，为了避免误判，需要将光标4的位置信息统一到一个坐标系中，而由于图片元素1是基于浏览器页面的可见区域2进行定义的，因此本发明实施例中优选地将光标4在屏幕3上的位置信息一致的转换到浏览器的可见区域2中，获得其在浏览器的页面可见区域2中的光标的位置信息。

在步骤S702处，依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

由于根据上述步骤S701已将光标4的位置信息统一变换到了浏览器的页面可见区域2中，因此，在统一的参考坐标下即浏览器的页面可见区域2中，通过当前光标4在浏览器的页面可见区域2的位置信息与所述图片元素1的位置信息进行比对，从而准确地判断出当前光标的位置是否在所述图片元素的显示区域中。即使光标移动到子框5上而实际未离开图片元素1时，由于通过当前光标4在浏览器的页面可见区域的位置信息，以及其与所述图片元素1的位置信息，得知光标依然在图片元素的显示区域内，因此，也就避免了误认为光标已移出图片元素的误判现象。

在上述的这个实施例中，子框5可以是本发明实施例中的图片工具条窗口，其中加载有对于图片元素1进行特定处理的按钮；子框5也可以是悬浮在浏览器中各窗口的顶层之上的DIV元素层，或者Iframe层，这时的图片工具条窗口可以设置在图片的周边上，例如在图6中所示子框5的上方图片元素1的右上角上方边缘处的图片工具条窗口（在图6中未示出）。在依据本发明实施例中的光标4移出图片元素1的判断之后，对于图片工具条窗口的显示或者隐藏就可以进行对应的正确判断了，保证只要鼠标还是在图片的区域范围中，就可以始终保证图片工具条窗口是显示的，从而保证对于图片工具的及时加载。例如，子框5是图片工具条窗口时，鼠标移至子框5上时，在图片上可能会产生鼠标移出事件，但是鼠标的位置确实还是在图片的区域范围中，从而可以保证图片工具条窗口不隐藏，继续显示，从而避免了误判。

由于上述实施例三至五基本相应于前述图1所示的方法实施例和图2所示的方法实施例，故本实施例的描述中未详尽之处，可以参见前述实施例中的相关说明，在此不做赘述。

在此提供的算法和显示不与任何特定计算机、虚拟系统或者其它设备固有相关。各种通用系统也可以与基于在此的示教一起使用。根据上面的描述，构造这类系统所要求的结构是显而易见的。此外，本发明也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本发明的内容，并且上面对特定语言所做的描述是为了披露本发明的最佳实施方式。

在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。

类似地，应当理解，为了精简本公开并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解，可以对实施例中的装置中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个装置中。可以把实施例中的模块组合成一个模块，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书（包括伴随的权利要求、摘要和附图）中公开的所有特征以及如此公开的任何方法或者装置的所有过程或单元进行组合。除非另外明确陈述，本说明书（包括伴随的权利要求、摘要和附图）中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在下面的权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

本发明的各个部件实施例可以以硬件实现，或者以在一个或者多个处理器上运行的软件模块实现，或者以它们的组合实现。本领域的技术人员应当理解，可以在实践中使用微处理器或者数字信号处理器（DSP）来实现根据本发明实施例的图片工具条窗口加载装置中的一些或者全部部件的一些或者全部功能。本发明还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序（例如，计算机程序和计算机程序产品）。这样的实现本发明的程序可以存储在计算机可读介质上，或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到，或者在载体信号上提供，或者以任何其他形式提供。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中，这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。

Claims (20)

1.一种图片工具条窗口加载方法，包括：

在网页子进程中打开网页标签，并获取网页中图片元素的位置信息；

在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到浏览器主进程；

浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口；

当启动浏览器时生成所述浏览器主进程，所述浏览器主进程对应一个或多个网页子进程，所述浏览器主进程只创建一个图片工具条窗口，所述图片工具条窗口在所述一个或多个网页子进程之间复用。

2.根据权利要求1所述的方法，其特征在于，所述在网页子进程中打开网页标签，并获取网页中图片元素的位置信息包括：

当前所述网页子进程遍历网页中的图片元素的位置信息和属性信息；以及

将所述图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

3.根据权利要求2所述的方法，其特征在于，所述图片元素的位置信息包括：

所述图片元素在当前所述网页子进程的页面可见区域中的左上角位置坐标和所述图片元素的宽和高；以及

所述图片元素的属性信息包括：图片大小、图片在本地缓存的地址、图片在云端的保存地址和/或所述图片元素的URL。

4.根据权利要求1所述的方法，其特征在于，所述图片元素的输入选择事件包括如下任一种事件：

鼠标悬浮事件、鼠标移入事件、鼠标移动事件、触摸按下事件、触摸移动事件、触摸长按事件、触摸滑动事件、键盘选定。

5.根据权利要求1所述的方法，其特征在于，所述依据所述图片元素的位置信息获得所述图片元素的显示区域信息包括：

获取并将所述图片元素的屏幕坐标转换到浏览器的页面可见区域中；

依据浏览器的页面可见区域的坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息。

6.根据权利要求1所述的方法，其特征在于，所述浏览器主进程依据所述判断结果，并依据所述图片元素的位置信息在指定位置处创建/隐藏图片工具条窗口包括：

当前光标的位置在所述图片元素的显示区域中时，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口；

否则，在指定位置处创建并隐藏图片工具条窗口。

7.根据权利要求1所述的方法，其特征在于，所述判断当前光标的位置是否在所述图片元素的显示区域中包括：

将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

8.根据权利要求1所述的方法，其特征在于，所述在网页子进程中打开网页标签，并获取网页中图片元素的位置信息包括：

当前所述网页子进程遍历网页中的所有图片元素的位置信息和属性信息；以及

按照遍历的先后顺序，将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

9.根据权利要求8所述的方法，其特征在于，进一步包括：

获取当前光标所在的图片的标题或URL信息，与所述遍历的图片元素的属性信息进行预先匹配；

获取到所述匹配的图片元素，然后获取当前光标的位置信息并与所述匹配图片元素的显示区域信息比较，判断当前光标的位置是否在所述匹配图片元素的显示区域中，将判断结果和所述匹配图片元素的位置信息通知到所述浏览器的主进程。

10.根据权利要求1-9任一项所述的方法，其特征在于，

所述指定位置为所述图片元素区域内的任一位置；或者

为所述图片元素边缘处的一位置。

11.一种图片工具条窗口加载装置，包括：

生成与获取模块，用于在网页子进程中打开网页标签，并获取网页中图片元素的位置信息；

监测与获取模块，用于在当前所述网页子进程中监测到对所述图片元素的输入选择事件时，依据所述图片元素的位置信息获得所述图片元素的显示区域信息；

判断与发送模块，用于获取当前光标的位置信息并与所述图片元素的显示区域信息比较，判断当前光标的位置是否在所述图片元素的显示区域中，将判断结果和所述图片元素的位置信息通知到浏览器主进程；

创建与显示模块，用于浏览器主进程依据所述判断结果和所述图片元素的位置信息，在指定位置处创建或显示或隐藏图片工具条窗口；

其中，当启动浏览器时生成所述浏览器主进程，所述浏览器主进程对应一个或多个网页子进程，所述浏览器主进程只创建一个图片工具条窗口，所述图片工具条窗口在所述一个或多个网页子进程之间复用。

12.根据权利要求11所述的装置，其特征在于，所述生成与获取模块包括：

遍历子模块，用于当前所述网页子进程遍历网页中的图片元素的位置信息和属性信息；以及

缓存子模块，用于将所述图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

13.根据权利要求12所述的装置，其特征在于，所述图片元素的位置信息包括：

所述图片元素在当前所述网页子进程的页面可见区域中的左上角位置坐标和所述图片元素的宽和高；以及

所述图片元素的属性信息包括：图片大小、图片在本地缓存的地址、图片在云端的保存地址和/或所述图片元素的URL。

14.根据权利要求11所述的装置，其特征在于，所述图片元素的输入选择事件包括如下任一种事件：

鼠标悬浮事件、鼠标移入事件、鼠标移动事件、触摸按下事件、触摸移动事件、触摸长按事件、触摸滑动事件、键盘选定。

15.根据权利要求11所述的装置，其特征在于，所述监测与获取模块还被配置成：

获取并将所述图片元素的屏幕坐标转换到浏览器的页面可见区域的坐标中；

依据浏览器的页面可见区域的坐标以及所述图片元素的位置信息获得所述图片元素的显示区域信息。

16.根据权利要求11所述的装置，其特征在于，所述创建与显示模块还被配置成：

当前光标的位置在所述图片元素的显示区域中时，浏览器主进程依据所述图片元素的位置信息，在指定位置处创建并显示图片工具条窗口；

否则，在指定位置处创建并隐藏图片工具条窗口。

17.根据权利要求11所述的装置，其特征在于，所述判断与发送模块还被配置成：

将当前光标在屏幕上位置信息转换为在浏览器的页面可见区域中的位置信息；

依据当前光标在浏览器的页面可见区域的位置信息与所述图片元素的位置信息进行比对，以判断当前光标的位置是否在所述图片元素的显示区域中。

18.根据权利要求11所述的装置，其特征在于，所述生成与获取模块包括：

遍历子模块，用于当前所述网页子进程遍历网页中的所有图片元素的位置信息和属性信息；以及

缓存子模块，用于按照遍历的先后顺序，将所有图片元素中当前所述图片元素及其相邻图片元素的位置信息和属性信息保存至当前所述网页子进程的缓存中。

19.根据权利要求18所述的装置，其特征在于，所述判断与发送模块还被配置成：

获取当前光标所在的图片的标题或URL信息，与所述遍历的图片元素的属性信息进行预先匹配；

获取到所述匹配的图片元素，然后获取当前光标的位置信息并与所述匹配图片元素的显示区域信息比较，判断当前光标的位置是否在所述匹配图片元素的显示区域中，将判断结果和所述匹配图片元素的位置信息通知到所述浏览器的主进程。

20.根据权利要求11-19任一项所述的装置，其特征在于，

所述指定位置为所述图片元素区域内的任一位置；或者

为所述图片元素边缘处的一位置。