CN110971955A - 页面处理方法及装置、电子设备以及存储介质 - Google Patents

Abstract

本公开是关于一种页面处理方法及装置、电子设备以及存储介质，涉及计算机技术领域，可以应用于移动端页面展示的情景。该页面处理方法包括：确定页面上高于预设页面对象层级的第一视频播放对象；响应视频播放操作，基于第一视频播放对象创建低于预设页面对象层级的第二视频播放对象；将第二视频播放对象代替第一视频播放对象在所述页面上展示。本公开可以解决由于第一视频播放对象播放视频导致遮挡预设页面对象的问题，可以在页面上展示低于所述第一视频播放对象层级的页面对象。

Description

页面处理方法及装置、电子设备以及存储介质

技术领域

本公开涉及计算机技术领域，具体而言，涉及一种页面处理方法、页面处理装置、电子设备以及存储介质。

背景技术

随着网络提速和手机性能的提升，越来越多的人选择利用手机等移动设备观看网络直播、影视作品等视频内容。HTML5页面利用video元素支持嵌入式的媒体文件，使得开发者能够方便地将视频文件嵌入手机所展示的页面中。

但在Android系统的部分浏览器中，video元素在播放视频时，自动将原生视频播放区域提高到页面最上层，如果这时在页面上添加遮罩层、弹框等元素，这些元素由于video元素的遮挡而无法显示。针对此问题，一方面，可以采用设置视频全屏播放来解决；另一方面，在点击展示遮罩层或弹框时，可以暂停播放视频，并将视频隐藏，将视频区域替换为代替视频区域展示的占位图片来规避该问题。

然而，设置视频全屏播放的方式，只是避免了视频播放时用户进行其它交互行为，并未在本质上解决该问题。另外，在点击遮罩层或弹框时，将视频暂停后隐藏，并将视频区域替换为占位图片的方法，导致页面产生交互时，视频暂停播放，降低了用户的使用体验。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种页面处理方法、页面处理装置、电子设备和存储介质，进而至少在一定程度上克服由于相关技术的限制和缺陷而导致的在移动端的部分浏览器中播放视频时，层级较低的页面对象及交互行为被视频播放区域遮挡而无法正常展示的问题。

根据本公开的一个方面，提供一种页面处理方法，包括：确定页面上第一视频播放对象；其中，第一视频播放对象的层级高于预设页面对象的层级；响应视频播放操作，基于第一视频播放对象创建第二视频播放对象；其中，第二视频播放对象的层级低于预设页面对象的层级；将第二视频播放对象代替第一视频播放对象在页面上展示。

可选的，基于第一视频播放对象创建第二视频播放对象包括：确定第一视频播放对象的页面展示信息；根据第一视频播放对象的页面展示信息确定第二视频播放对象的页面展示信息。

可选的，将第二视频播放对象代替第一视频播放对象在页面上展示包括：将第一视频播放对象在页面上隐藏；采用第二视频播放对象创建绘图对象；利用绘图对象并基于第一视频播放对象的图像绘制第二视频播放对象的图像；将绘制出的第二视频播放对象的图像在页面上展示。

可选的，将第一视频播放对象在页面上隐藏包括：将第一视频播放对象置于页面的非显示位置，且输出第一视频播放对象的视频声音。

可选的，页面处理方法还包括：基于第一视频播放对象创建第二视频播放对象后，每隔预设时间段确定第一视频播放对象上的中间图像；利用绘图对象并基于中间图像绘制第二视频播放对象的图像并在页面上展示。

可选的，页面处理方法还包括：响应用户的视频暂停操作，暂停播放第一视频播放对象当前播放的视频，并中止绘制第二视频播放对象的图像。

可选的，页面处理方法还包括：响应用户的继续播放操作，每隔预设时间段绘制第二视频播放对象的图像。

可选的，预设时间段包括：第一视频播放对象所播放视频的每一帧对应的时间段。

根据本公开的第二方面，提供一种页面处理装置，包括：视频对象确定模块，用于确定页面上第一视频播放对象；其中，第一视频播放对象的层级高于预设页面对象的层级；视频对象创建模块，用于响应视频播放操作，基于第一视频播放对象创建第二视频播放对象；其中，第二视频播放对象的层级低于预设页面对象的层级；视频对象替换模块，用于将第二视频播放对象代替第一视频播放对象在页面上展示。

可选的，视频对象创建模块包括展示信息确定单元。

具体的，展示信息确定单元用于确定第一视频播放对象的页面展示信息；根据第一视频播放对象的页面展示信息确定第二视频播放对象的页面展示信息。

可选的，视频对象替换模块包括替换对象展示单元。

具体的，替换对象展示单元用于将第一视频播放对象在页面上隐藏；采用第二视频播放对象创建绘图对象；利用绘图对象并基于第一视频播放对象的图像绘制第二视频播放对象的图像；将绘制出的第二视频播放对象的图像在页面上展示。

可选的，替换对象展示单元包括视频对象隐藏子单元。

具体的，视频对象隐藏子单元用于将第一视频播放对象置于页面的非显示位置，且输出第一视频播放对象的视频声音。

可选的，页面处理装置还包括中间图像绘制模块。

具体的，中间图像绘制模块用于每隔预设时间段确定第一视频播放对象上的中间图像；利用绘图对象并基于中间图像绘制第二视频播放对象的图像并在页面上展示。

可选的，页面处理装置还包括暂停播放响应模块。

具体的，暂停播放响应模块用于响应用户的视频暂停操作，暂停播放第一视频播放对象当前播放的视频，并中止绘制第二视频播放对象的图像。

可选的，页面处理装置还包括继续播放响应模块。

具体的，继续播放响应模块用于响应用户的继续播放操作，每隔预设时间段绘制第二视频播放对象的图像。

可选的，页面处理装置还包括预设时间段确定模块。

具体的，预设时间段确定模块用于确定第一视频播放对象所播放视频的每一帧对应的时间段。

根据本公开的第三方面，提供一种电子设备，包括：处理器；以及存储器，存储器上存储有计算机可读指令，计算机可读指令被处理器执行时实现根据上述任意一项的页面处理方法。

根据本公开的第四方面，提供一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现根据上述任意一项的页面处理方法。

本公开的示例性实施例中的页面处理方法，确定页面上层级高于预设页面对象层级的第一视频播放对象；响应视频播放操作，基于第一视频播放对象创建层级低于预设页面对象层级的第二视频播放对象；将第二视频播放对象代替第一视频播放对象在页面上展示。一方面，通过该页面处理方法可以利用第二视频播放对象显示与第一视频播放对象所播放的视频内容无差别的视频画面；另一方面，可以使页面上层级低于第一视频播放对象的预设页面对象和交互行为正常展示。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。在附图中：

图1示意性示出了页面播放视频时页面对象正常展示的页面展示图；

图2示意性示出了Android系统的部分浏览器播放视频时遮挡层级较低的页面对象的页面展示图；

图3示意性示出了根据本公开的示例性实施方式的页面处理方法的流程图；

图4示意性示出了本公开的示例性实施方式中支持video元素的移动端浏览器版本；

图5示意性示出了本公开的示例性实施方式中支持canvas元素的移动端浏览器版本；

图6示意性示出了本公开的示例性实施方式中页面上的第一视频播放对象；

图7示意性示出了本公开的示例性实施方式中页面上基于第一视频播放对象创建的第二视频播放对象；

图8示意性示出了本公开的示例性实施方式中页面响应用户点击暂停播放视频操作后的页面状态；

图9示意性示出了本公开的示例性实施方式中视频播放完毕后将第一视频播放对象重新展示在页面上的页面状态；

图10示意性示出了本公开的示例性实施方式中页面采用第二视频播放对象播放视频时弹幕等页面对象的显示状态；

图11示意性示出了本公开的示例性实施方式中页面采用第二视频播放对象播放视频时弹框和遮罩层等页面对象的显示状态；

图12示意性示出了根据本公开的第一示例性实施方式的页面处理装置的方框图；

图13示意性示出了根据本公开的示例性实施方式的视频对象创建模块的方框图；

图14示意性示出了根据本公开的示例性实施方式的视频对象替换模块的方框图；

图15示意性示出了根据本公开的示例性实施方式的替换对象展示单元的方框图；

图16示意性示出了根据本公开的第二示例性实施方式的页面处理装置的方框图；

图17示意性示出了根据本公开的第三示例性实施方式的页面处理装置的方框图；

图18示意性示出了根据本公开的第四示例性实施方式的页面处理装置的方框图；

图19示意性示出了根据本公开的第五示例性实施方式的页面处理装置的方框图；

图20示意性示出了根据本公开一示例性实施例的电子设备的框图；

图21示意性示出了根据本公开一示例性实施例的计算机可读存储介质的示意图。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。

此外，附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

HTML5页面播放嵌入式的媒体文件时，参考图1和图2，在Android系统的部分浏览器(如：微信内嵌浏览器、QQ浏览器、UC浏览器等)中，出现了页面播放视频时自动将原生视频播放区域提高到页面最上层，遮挡住层级较低的如遮罩层、弹框、弹幕等页面对象的问题，而视频播放对象的层级无法通过CSS样式修改，导致安卓手机中层级较低的页面对象不能正常展示。

基于此，本公开提供了一种页面处理方法，该页面处理方法可以利用终端设备来实现，其中，所述终端设备例如可以为手机、PDA等各种电子设备。另外，该页面处理方法也可以利用服务器来实现。参考图3，该页面处理方法可以包括以下步骤：

S310.确定页面上第一视频播放对象。

在本公开的示例性实施方式中，终端设备可以确定页面上用来播放视频的第一视频播放对象，其中，第一视频播放对象的层级在页面上的层级可以例如最高。层级可以是在页面上显示的所有页面对象的页面层级，由于页面上的所有页面对象都是按照一定的层级堆叠在一起从而在页面上进行展示，层级较低的页面对象在较下层展示，层级较高的页面对象将在层级较低的页面对象的较上层展示。举例而言，在HTML页面中，可以通过z-index来设置不同页面对象的层级，例如，页面上四个页面对象的层级分别定义为第一页面对象z-index＝-9999，第二页面对象z-index＝0，第三页面对象z-index＝1，第四页面对象z-index＝2，按照层级显示页面对象，则沿屏幕内部到人眼所在位置的方向页面对象的显示顺序依次为第一页面对象、第二页面对象、第三页面对象、第四页面对象，其中，第四页面对象显示在页面最上层。

第一视频播放对象在页面上可以例如拥有最高层级，因此，第一视频播放对象的层级高于预设页面对象。或者，第一视频播放对象在页面上不是最高层级，然而，其层级高于预设页面对象。预设页面对象是指层级比第一视频播放对象层级低的页面对象，预设页面对象可以包括但不限于：遮罩层、弹框、弹幕等页面对象。举例而言，第一视频播放对象可以是HTML5页面中的video元素，video元素在播放视频文件时，将自动提升自身层级，自身视频播放区域提高到页面最上层。这时，如遮罩层、弹框、弹幕等的预设页面对象将被video元素的视频播放区域遮挡，使得这些页面对象不能正常展示。

需要说明的是，本公开所使用的术语“第一”、“第二”、“第三”、“第四”等，仅是为了区分同一页面上不同的页面对象，并不应对本公开造成任何限制。

S320.响应视频播放操作，基于第一视频播放对象创建第二视频播放对象。

在本公开的示例性实施方式中，确定页面上的第一视频播放对象后，等待第一视频播放对象进行视频播放。当第一视频播放对象开始播放视频时，响应第一视频播放对象的视频播放操作并基于第一视频播放对象创建第二视频播放对象，其中，所创建的第二视频播放对象的层级低于预设页面对象的层级。基于第一视频播放对象所创建的第二视频播放对象，第二视频播放对象的部分属性是基于第一视频播放对象得到的，这些属性可以包括但不限于宽度、高度、所在页面的位置等，如第二视频播放对象的宽度、高度、页面位置的等页面展示信息与第一视频播放对象的宽度、高度、页面位置相同，用来实现视频图像的展示。举例而言，当第一视频播放对象是video元素时，可以通过监听video元素的play方法来确定video元素是否在播放视频，利用play方法的返回值来确定video元素是否正在播放视频的状态。

S330.将第二视频播放对象代替第一视频播放对象在页面上展示。

在本公开的示例性实施方式中，所创建的第二视频播放对象代替第一视频播放对象完成在页面展示视频文件的功能。第二视频播放对象不仅可以满足用户观看视频文件的需求，而且第二视频播放对象播放视频时预设页面对象和一些交互行为可以在页面上正常展示。举例而言，创建的第二视频播放对象canvas元素在代替第一视频播放对象video元素在页面上展示视频时，可以满足预设页面对象在canvas元素的视频播放区域上方展示，并且一些交互行为在视频播放时可以正常进行。预设页面对象可以包括但不限于遮罩层、弹框、弹幕等。此外，交互行为可以包括但不限于点击展示遮罩层、在视频播放时同步展示弹幕等。

需要说明的是，支持第一视频播放对象的浏览器等页面载体同时支持第二视频播放对象，如第一视频播放对象为video元素，第二视频播放对象为canvas元素时，参考图4和图5，图4和图5分别列出了支持video元素和canvas元素的移动端浏览器版本，图4中除Opera Mini不支持video元素外，其余方格标注出的浏览器版本都支持video元素；图5中方格标注出的浏览器版本本公开对于支持视频对象的页面载体不做特殊限定。

参考图6和图7，在本公开的一些示例性实施方式中，基于第一视频播放对象创建第二视频播放对象时，首先，确定第一视频播放对象的页面展示信息，第一视频播放对象的页面展示信息可以包括但不限于第一视频播放对象的宽度、高度、页面位置；其次，根据第一视频播放对象的页面展示信息确定第二视频播放对象的页面展示信息。第二视频播放对象的宽度、高度、页面位置等页面展示信息与第一视频播放对象的相同，用来代替第一视频播放对象播放视频内容，以实现用户无感知的替换。第一视频播放对象的宽度、高度即第一视频播放对象在页面上显示的尺寸，第一视频播放对象的页面位置为第一视频播放对象在页面展示的位置。举例而言，当第一视频播放对象为video元素时，可以设置video元素的宽度、高度、页面位置，例如，video元素的宽度和高度可以分别设置为320个像素和240个像素，页面位置可以设置为x＝0，y＝0。第二视频播放对象为canvas元素时，canvas元素的宽度、高度、页面位置与video元素的相同，canvas元素的宽度和高度可以分别设置为320个像素和240个像素，页面位置可以设置为x＝0，y＝0。

在本公开的一些示例性实施方式中，针对将第二视频播放对象代替第一视频播放对象在页面上展示的过程，首先，可以将第一视频播放对象在页面上隐藏；其次，采用第二视频播放对象创建绘图对象；再次，利用绘图对象并基于第一视频播放对象的图像绘制第二视频播放对象的图像；接下来，将绘制出的第二视频播放对象的图像在页面上展示。

根据本公开的一些示例性实施例，将第一视频播放对象在页面隐藏例如可以将第一视频播放对象置于页面的显示位置，可以通过设置隐藏的方式将第一视频播放对象置于页面的最下层，使页面显示不出第一视频播放对象。但是第一视频播放对象的视频声音仍然可以正常输出。举例而言，若第一视频播放对象是video元素时，可以通过设置video元素的CSS样式来实现，如display：none。容易理解的是，本公开也可以通过其它方式将第一视频播放对象在页面中隐藏，本公开对此不做特殊限定。

将第一视频播放对象在页面中隐藏后，采用第二视频播放对象创建绘图对象。由于在特定的浏览器中不支持其它在播放视频时可以将层级较低的页面对象正常展示的视频播放元素，因此，所创建的第二视频播放对象仅仅可以展示视频图像，无法直接播放视频文件。当在页面上为用户展示与第一视频播放对象无差别的播放效果时，可以根据第一视频播放对象所播放的视频帧来确定第二视频播放对象的图像，并按照一定频率将绘制出的第二视频播放对象的图像在页面上展示以达到采用第二视频播放对象展示视频画面的效果。

根据本公开的一些示例性实施例，基于第一视频播放对象创建第二视频播放对象后，每隔预设时间段确定第一视频播放对象上的中间图像；利用绘图对象并基于中间图像绘制第二视频播放对象的图像并在页面上展示。预设时间段可以为第一视频播放对象所播放的视频内容的每一帧对应的时间段，一般采用帧率来衡量一个视频文件每秒播放的帧数。举例而言，一个视频的帧率为50帧每秒，则说明该视频播放一秒钟有50帧静态图像，播放一帧所间隔的时间为20毫秒，则预设时间段可以为20毫秒。根据人眼视觉暂留现象，当连续的图像变化超过每秒24帧的时候，人眼便无法分辨每幅单独的静态画面，因而看上去是平滑连续的视觉效果。因此，第一视频播放对象每秒钟所播放的帧数达到一定数量时，产生连续动态的画面效果，使得用户可观看流畅的视频内容。

需要说明的是，可以根据不同的视频文件确定相应的预设时间段，视频文件的帧率只要满足人眼视觉暂留现象的需要而形成平滑连续的视觉效果即可，本公开对此不做特殊限定。

中间图像可以为第一视频播放对象所播放的视频文件的每一帧图像，将中间图像绘制在第二视频播放对象上可以通过绘图对象来实现。举例而言，当第二视频播放对象为HTML5中的canvas元素时，可以通过创建一个context对象作为绘图对象来实现在canvas元素上添加图像。具体做法为：利用canvas的getContext方法并传入目前唯一合法的参数值“2d”，返回一个CanvasRenderingContext2D的对象，该对象获取了canvas元素上绘图的环境，指定了二维绘图。将CanvasRenderingContext2D对象赋值给context对象，context对象即为绘图对象。在一个canvas元素上可以创建一个或多个context对象来绘制图像，而对于为第二视频播放对象添加图像，只创建一个context对象即可。

进一步地，创建了context对象后，context对象调用相应的绘图方法来绘制context对象的图像，从而为第二视频播放对象添加图像。context对象对应的绘图方法为drawImage方法，采用drawImage方法绘制context对象的图像，drawImage方法有三种参数可以选择，以下是这三种参数选择进行应用的场景。

(1)“context.drawImage(img)；”，其中，img参数应为video元素所播放的视频文件的名称，该方法可以基于video元素所播放的视频文件，将video元素所播放的视频文件的每一帧作为将绘制的图像，以每两个帧之间间隔的时间段为时间间隔来绘制图像。此外，由于该方法只传入了img一个参数，未传入的参数都是系统默认自动生成，具体为“context.drawImage(img,0,0)；”,默认图像的页面位置为x＝0，y＝0，图像的宽度、高度则与视频文件中帧的宽度、高度相同。

(2)“context.drawImage(img,x,y)；”，其中，img参数为video元素所播放的视频文件的名称，该方法基于video元素所播放的视频文件绘制图像，同时传入了所绘制图像的页面位置，根据传入的页面位置确定绘制图像的页面位置，图像的宽度、高度则与视频文件中帧的宽度、高度相同。

(3)“context.drawImage(img,x,y,width,height)；”，其中，img参数为video元素所播放的视频文件的名称，该方法基于video元素所播放的视频文件绘制图像，此外，该方法传入了待绘制图像的宽度、高度、页面位置，将基于video元素所播放的视频文件并按照所传入的图像的宽度、高度、页面位置绘制图像。在本公开中，调用drawImage方法时，只有img参数是必传的选项，是绘图对象绘制图像的图像来源。

需要说明的是，所述页面也可以不是HTML5页面，所有出现预设页面对象不能正常展示的页面均可以采用本公开的方法来解决，本示例性实施方式中对此不做特殊限定。

参考图8，在本公开的一些示例性实施方式中，在第一视频播放对象播放视频时，如果出现了用户点击暂停播放视频的操作，将响应用户的视频暂停操作时，暂停播放第一视频播放对象当前播放的视频，并中止绘制第二视频播放对象的图像。在第一视频播放对象播放视频时，第一视频播放对象在页面上处于隐藏状态，因此用户点击页面时，点击的是第二视频播放对象，为了使用户点击页面的同时可以使第一视频播放对象与第二视频播放对象同步，可以采用代码进行关联控制。举例而言，当页面为HTML5页面，第一视频播放对象为video元素，第二视频播放对象是canvas元素时，如果用户出现点击暂停播放操作，可以利用JavaScript脚本将video元素播放的视频暂停，并且中止绘制canvas元素的图像。可以通过设置标志位来标记video元素是否正在播放视频，如可以用“1”表示video元素正在播放视频，视频声音可以正常输出；用“0”表示video元素此时未播放视频，视频声音被暂停输出。

在本公开的另外一些示例性实施方式中，当用户点击了暂停播放视频后，可能出现用户点击继续播放的操作，响应用户的继续播放操作时，每隔预设时间段绘制第二视频播放对象的图像。举例而言，仍然将页面作为HTML5页面，第一视频播放对象作为video元素，第二视频播放对象作为canvas元素，用户点击继续播放的操作之前，一定出现过用户点击暂停播放视频的操作，此时video元素的标志位为“0”，表示video元素此时未播放视频，用户点击继续播放视频的操作后，video元素的标志位变为为“1”，表示video元素正在播放视频，此时，将每隔预设时间段绘制canvas元素的图像。

进一步地，当视频播放结束后，可以将第一视频播放对象在页面上继续隐藏，第二视频播放对象在页面上继续保留；此外，还可以将第二视频播放对象隐藏，将隐藏在页面上的第一视频播放对象显示在页面上。参考图9，举例而言，可以通过设置CSS样式将第一视频播放对象显示在页面上，如display：block。容易理解的是，还可以采用其它方式将隐藏在页面上的第一视频播放对象显示在页面上，这些使第一视频播放对象显示在页面上的方法变化均属于本公开的保护范围。

综上所述，首先确定页面上层级高于预设页面对象层级的第一视频播放对象；其次响应视频播放操作，将第一视频播放对象在页面上隐藏，并基于第一视频播放对象创建层级低于预设页面对象层级的第二视频播放对象；最后将第二视频播放对象代替第一视频播放对象在页面上展示，由第二视频播放对象创建的绘图对象每隔预设时间段绘制第二视频播放对象，当以一定频率绘制第二视频播放对象的图像时，使在页面上展示的图像产生一种使人眼感到平滑流畅播放的视觉效果。参考图10和图11，一方面，通过本公开的页面处理方法，将第一视频播放对象在页面上隐藏后，只要视频内容仍在播放，视频的声音仍然可以正常输出，利用第二视频播放对象代替第一视频播放对象完成视频展示操作，做到用户无感知的替换；另一方面，采用第二视频播放对象在页面上展示时，可以使层级较低的页面对象以及一些特定的交互行为在视频播放时在页面上正常展示，提升用户的观影体验。

此外，在本公开的示例性实施方式中，还提供了一种页面处理装置。参考图12，该页面处理装置1200可以包括视频对象确定模块1210、视频对象创建模块1220以及视频对象替换模块1230。

具体的，视频对象确定模块1210可以用于确定页面上第一视频播放对象；其中，第一视频播放对象的层级高于预设页面对象的层级；视频对象创建模块1220可以用于响应视频播放操作，基于第一视频播放对象创建第二视频播放对象；其中，第二视频播放对象的层级低于预设页面对象的层级；视频对象替换模块1230可以用于将第二视频播放对象代替第一视频播放对象在页面上展示。

该页面处理装置1200可以满足在页面上播放视频的同时，将低于第一视频播放对象层级的预设页面对象在页面上正常展示出来，不会出现层级较低的页面对象在视频播放时被视频播放区域遮挡的问题，是一种行之有效的页面处理装置。

根据本公开的一些示例性实施例，参考图13，视频对象创建模块1220可以包括展示信息确定单元1310。

具体的，展示信息确定单元1310可以用于确定第一视频播放对象的页面展示信息；根据第一视频播放对象的页面展示信息确定第二视频播放对象的页面展示信息。

通过展示信息确定单元1310可以确定出第一视频播放对象在页面上展示时的展示信息，展示信息包括但不限于第一视频播放对象的宽度、高度、页面位置等信息，根据第一视频播放对象的页面展示信息确定第二视频播放对象的页面展示信息，从而使第二视频播放对象代替第一视频播放对象进行视频展示时，做到用户无感知的替换。

根据本公开的另外一些示例性实施例，参考图14，视频对象替换模块1230可以包括替换对象展示单元1410。

具体的，替换对象展示单元1410用于将第一视频播放对象在页面上隐藏；采用第二视频播放对象创建绘图对象；利用绘图对象并基于第一视频播放对象的图像绘制第二视频播放对象的图像；将绘制出的第二视频播放对象的图像在页面上展示。

替换对象展示单元1410将第一视频播放对象在页面上隐藏后，基于第一视频播放对象所播放的视频，利用绘图对象不断地绘制第二视频播放对象的图像，通过第二视频播放对象将第一视频播放对象所播放的视频内容在页面上展示出来。

根据本公开的另外一些示例性实施例，参考图15，替换对象展示单元1410可以包括视频对象隐藏子单元1510。

具体的，视频对象隐藏子单元1510用于将第一视频播放对象置于页面的非显示位置，且输出第一视频播放对象的视频声音。

视频对象隐藏子单元1510将第一视频播放对象置于页面中使其显示不出的位置后，第一视频播放对象所播放的视频声音依然可以正常输出，便于与第二视频播放对象的视频画面匹配。

在本公开的一些示例性实施方式中，还提供了页面处理装置1600。参考图16，页面处理装置1600相比于页面处理装置1200，除包括视频对象确定模块1210、视频对象创建模块1220以及视频对象替换模块1230外，还可以包括中间图像绘制模块1610。

具体的，该中间图像绘制模块1610可以用于在基于第一视频播放对象创建第二视频播放对象后，每隔预设时间段确定第一视频播放对象上的中间图像；利用绘图对象并基于中间图像绘制第二视频播放对象的图像并在页面上展示。

中间图像绘制模块1610可以在第一视频播放对象播放视频时，每隔预设时间段确定第一视频播放对象上的视频帧，利用人眼视觉暂留现象，基于确定的视频帧，每隔预设时间段绘制一次第二视频播放对象的图像，以达到在使用第二视频播放对象播放视频时，用户产生与使用第一视频播放对象播放视频时无差别的视觉效果。

在本公开的另一示例性实施方式中，还提供了页面处理装置1700。参考图17，页面处理装置1700相比于页面处理装置1600，除包括视频对象确定模块1210、视频对象创建模块1220、视频对象替换模块1230以及中间图像绘制模块1610外，还可以包括暂停播放响应模块1710。

具体的，暂停播放响应模块1710可以用于响应用户的视频暂停操作，暂停播放第一视频播放对象当前播放的视频，并中止绘制第二视频播放对象的图像。

暂停播放响应模块1710可以对用户的视频暂停播放操作做出响应，从而可以暂停播放第一视频播放对象当前播放的视频，第一视频播放对象的声音也被暂停输出，并且中止绘制第二视频播放对象的图像，这样用户所看到的第二视频播放对象也停止了图像的更新，形成视频暂停播放的效果。

在本公开的又一示例性实施方式中，还提供了页面处理装置1800。参考图18，页面处理装置1800相比于页面处理装置1700，除包括视频对象确定模块1210、视频对象创建模块1220、视频对象替换模块1230、中间图像绘制模块1610以及暂停播放响应模块1710外，还可以包括继续播放响应模块1810。

具体的，继续播放响应模块1810可以用于响应用户的继续播放操作，每隔预设时间段绘制第二视频播放对象的图像。

继续播放响应模块1810可以用于在用户点击暂停视频播放操作后，又点击继续播放视频的操作，响应用户的继续播放操作。此时，第一视频播放对象又开始播放视频，第一视频播放对象的视频声音又开始正常输出，同时，绘图对象继续开始基于第一视频播放对象的视频帧每隔预设时间段绘制第二视频播放对象的图像。

在本公开的再一示例性实施方式中，还提供了页面处理装置1900。参考图19，页面处理装置1900相比于页面处理装置1800，除包括视频对象确定模块1210、视频对象创建模块1220、视频对象替换模块1230、中间图像绘制模块1610、暂停播放响应模块1710、继续播放响应模块1810外，还可以包括预设时间段确定模块1910。

具体的，预设时间段确定模块1910可以用于确定第一视频播放对象所播放视频的每一帧对应的时间段。

预设时间段确定模块1910可以确定出第一视频播放对象上所播放的视频文件中每秒播放的视频帧数，从而确定出播放每一帧所对应的时间段。

上述中各虚拟页面处理装置模块的具体细节已经在对应的虚拟页面处理方法中进行了详细的描述，因此此处不再赘述。

应当注意，尽管在上文详细描述中提及了页面处理装置的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

此外，在本公开的示例性实施例中，还提供了一种能够实现上述页面处理方法的电子设备。

所属技术领域的技术人员能够理解，本发明的各个方面可以实现为系统、方法或程序产品。因此，本发明的各个方面可以具体实现为以下形式，即：完全的硬件实施例、完全的软件实施例(包括固件、微代码等)，或硬件和软件方面结合的实施例，这里可以统称为“电路”、“模块”或“系统”。

下面参考图20来描述根据本发明的这种实施例的电子设备2000。图20显示的电子设备2000仅仅是一个示例，不应对本发明实施例的功能和使用范围带来任何限制。

如图20所示，电子设备2000以通用计算设备的形式表现。电子设备2000的组件可以包括但不限于：上述至少一个处理单元2010、上述至少一个存储单元2020、连接不同系统组件(包括存储单元2020和处理单元2010)的总线2030、显示单元2040。

其中，所述存储单元存储有程序代码，所述程序代码可以被所述处理单元2010执行，使得所述处理单元2010执行本说明书上述“示例性方法”部分中描述的根据本发明各种示例性实施例的步骤。

存储单元2020可以包括易失性存储单元形式的可读介质，例如随机存取存储单元(RAM)2021和/或高速缓存存储单元2022，还可以进一步包括只读存储单元(ROM)2023。

存储单元2020还可以包括具有一组(至少一个)程序模块2025的程序/实用工具2024，这样的程序模块2025包括但不限于：操作系统、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。

总线2030可以为表示几类总线结构中的一种或多种，包括存储单元总线或者存储单元控制器、外围总线、图形加速端口、处理单元或者使用多种总线结构中的任意总线结构的局域总线。

电子设备2000也可以与一个或多个外部设备2070(例如键盘、指向设备、蓝牙设备等)通信，还可与一个或者多个使得用户能与该电子设备2000交互的设备通信，和/或与使得该电子设备2000能与一个或多个其它计算设备进行通信的任何设备(例如路由器、调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口2050进行。并且，电子设备2000还可以通过网络适配器2060与一个或者多个网络(例如局域网(LAN)，广域网(WAN)和/或公共网络，例如因特网)通信。如图所示，网络适配器2060通过总线2030与电子设备2000的其它模块通信。应当明白，尽管图中未示出，可以结合电子设备2000使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。

通过以上的实施例的描述，本领域的技术人员易于理解，这里描述的示例实施例可以通过软件实现，也可以通过软件结合必要的硬件的方式来实现。因此，根据本公开实施例的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中或网络上，包括若干指令以使得一台计算设备(可以是个人计算机、服务器、终端装置、或者网络设备等)执行根据本公开实施例的方法。

在本公开的示例性实施例中，还提供了一种计算机可读存储介质，其上存储有能够实现本说明书上述方法的程序产品。在一些可能的实施例中，本发明的各个方面还可以实现为一种程序产品的形式，其包括程序代码，当所述程序产品在终端设备上运行时，所述程序代码用于使所述终端设备执行本说明书上述“示例性方法”部分中描述的根据本发明各种示例性实施例的步骤。

参考图21，描述了根据本发明的实施例的用于实现上述方法的程序产品2100，其可以采用便携式紧凑盘只读存储器(CD-ROM)并包括程序代码，并可以在终端设备，例如个人电脑上运行。然而，本发明的程序产品不限于此，在本文件中，可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

所述程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以为但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

计算机可读信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了可读程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。可读信号介质还可以是可读存储介质以外的任何可读介质，该可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。

可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于无线、有线、光缆、RF等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言的任意组合来编写用于执行本发明操作的程序代码，所述程序设计语言包括面向对象的程序设计语言—诸如Java、C++等，还包括常规的过程式程序设计语言—诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算设备上执行、部分地在用户设备上执行、作为一个独立的软件包执行、部分在用户计算设备上部分在远程计算设备上执行、或者完全在远程计算设备或服务器上执行。在涉及远程计算设备的情形中，远程计算设备可以通过任意种类的网络，包括局域网(LAN)或广域网(WAN)，连接到用户计算设备，或者，可以连接到外部计算设备(例如利用因特网服务提供商来通过因特网连接)。

此外，上述附图仅是根据本发明示例性实施例的方法所包括的处理的示意性说明，而不是限制目的。易于理解，上述附图所示的处理并不表明或限制这些处理的时间顺序。另外，也易于理解，这些处理可以是例如在多个模块中同步或异步执行的。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其他实施例。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由权利要求指出。

应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限。

Claims (11)

1.一种页面处理方法，其特征在于，包括：

确定页面上第一视频播放对象；其中，所述第一视频播放对象的层级高于预设页面对象的层级；

响应视频播放操作，基于所述第一视频播放对象创建第二视频播放对象；其中，所述第二视频播放对象的层级低于所述预设页面对象的层级；

将所述第二视频播放对象代替所述第一视频播放对象在所述页面上展示。

2.根据权利要求1所述的页面处理方法，其特征在于，基于所述第一视频播放对象创建第二视频播放对象包括：

确定所述第一视频播放对象的页面展示信息；

根据所述第一视频播放对象的页面展示信息确定所述第二视频播放对象的页面展示信息。

3.根据权利要求1所述的页面处理方法，其特征在于，将所述第二视频播放对象代替所述第一视频播放对象在所述页面上展示包括：

将所述第一视频播放对象在页面上隐藏；

采用所述第二视频播放对象创建绘图对象；

利用所述绘图对象并基于所述第一视频播放对象的图像绘制所述第二视频播放对象的图像；

将绘制出的所述第二视频播放对象的图像在所述页面上展示。

4.根据权利要求3所述的页面处理方法，其特征在于，将所述第一视频播放对象在页面上隐藏包括：

将所述第一视频播放对象置于页面的非显示位置，且输出所述第一视频播放对象的视频声音。

5.根据权利要求3所述的页面处理方法，其特征在于，基于所述第一视频播放对象创建所述第二视频播放对象后，所述页面处理方法还包括：

每隔预设时间段确定所述第一视频播放对象上的中间图像；

利用所述绘图对象并基于所述中间图像绘制所述第二视频播放对象的图像并在所述页面上展示。

6.根据权利要求5所述的页面处理方法，其特征在于，所述页面处理方法还包括：

响应用户的视频暂停操作，暂停播放所述第一视频播放对象当前播放的视频，并中止绘制所述第二视频播放对象的图像。

7.根据权利要求6所述的页面处理方法，其特征在于，所述页面处理方法还包括：

响应用户的继续播放操作，每隔所述预设时间段绘制所述第二视频播放对象的图像。

8.根据权利要求5或7所述的页面处理方法，其特征在于，所述预设时间段包括：

所述第一视频播放对象所播放视频的每一帧对应的时间段。

9.一种页面处理装置，其特征在于，包括：

视频对象确定模块，用于确定页面上第一视频播放对象；其中，所述第一视频播放对象的层级高于预设页面对象的层级；

视频对象创建模块，用于响应视频播放操作，基于所述第一视频播放对象创建第二视频播放对象；其中，所述第二视频播放对象的层级低于所述预设页面对象的层级；

视频对象替换模块，用于将所述第二视频播放对象代替所述第一视频播放对象在所述页面上展示。

10.一种电子设备，其特征在于，包括：

处理器；以及

存储器，所述存储器上存储有计算机可读指令，所述计算机可读指令被所述处理器执行时实现根据权利要求1至8中任一项所述的页面处理方法。

11.一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现根据权利要求1至8中任一项所述的页面处理方法。

Images