CN109710353A - 页面中的动画元素的展现方法及装置 - Google Patents

Abstract

本发明公开了一种页面中的动画元素的展现方法及装置，涉及电子信息领域，该方法包括：确定所述页面中与所述动画元素相对应的可交互区域；当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。该方式能够根据动画元素对应的可交互区域中接收到的用户交互操作来确定动画元素的播放状态信息，从而使动画元素当前所显示的内容能够随着用户交互操作而发生改变，从而有效吸引用户注意力，能够与用户产生互动，进而有利于提升动画元素的曝光点击率。

Description

页面中的动画元素的展现方法及装置

技术领域

本发明涉及电子信息领域，具体涉及一种页面中的动画元素的展现方法及装置。

背景技术

为了提升用户的视觉体验，页面中往往会包含多种各样的页面元素，例如，图片元素、文字元素、动画元素等。其中，动画元素以其画面灵动、信息多变等诸多优势获得了大量用户的青睐。图1示出了动画元素的常规播放方式，该动画元素由一组图片组成，并在4秒内播放完成，即：每隔40毫秒播放一张图片，以达到动态画面的视觉效果。目前，在页面中展现该类动画元素时，通常采用如下两种方式：

在第一种方式中，无论页面处于何种状态，其中的动画元素一直显示带有播放按钮的默认画面，该默认画面既可以是该动画元素的第一帧画面，也可以是该动画元素中具有代表性的画面。只有当用户点击其中的播放按钮时，才会触发该动画元素的播放过程。该种方式在页面浏览过程中，只能持续性显示动画元素中包含的一帧静态画面，由于静态画面无法发生改变，因此无法吸引用户的注意力。在第二种方式中，无论页面处于何种状态，其中的动画元素一直循环播放各个画面帧。该种方式在页面浏览过程中，一直循环播放各个画面帧，由于循环播放的内容毫不间断，因此容易使用户产生审美疲劳，从而忽略该动画元素。

发明人在实现本发明的过程中，发现上述两种方式至少都存在如下问题：无论是默认画面方式还是循环播放方式，都无法有效吸引用户的注意力、且无法与用户产生互动，无法提升该动画元素的曝光点击率。

发明内容

鉴于上述问题，提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的一种页面中的动画元素的展现方法及装置。

根据本发明的一个方面，提供了一种页面中的动画元素的展现方法，包括：

确定所述页面中与所述动画元素相对应的可交互区域；

当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；

根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。

可选地，所述确定所述页面中与所述动画元素相对应的可交互区域包括：

根据预设的页面结构表，将与所述动画元素相对应的子节点确定为目标子节点；

查询所述页面结构表，将所述目标子节点所对应的节点类型为可交互类型的父节点确定为可交互节点；

将所述可交互节点所对应的页面区域确定为所述与所述动画元素相对应的可交互区域。

可选地，当所述可交互区域为可滚动区域时，所述用户交互操作的操作状态信息包括：滚动方向和/或滚动距离；

则所述根据所述操作状态信息确定所述动画元素的播放状态信息包括：根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息；

则所述在所述页面中按照所述播放状态信息展现所述动画元素包括：在所述页面中展现所述动画元素中包含的与所述时间进度信息相对应的画面帧。

可选地，所述根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息包括：

根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素相对于所述可交互区域的位置信息；

根据所述位置信息，确定所述动画元素的播放状态信息中包含的时间进度信息。

可选地，所述确定所述动画元素相对于所述可交互区域的位置信息包括：

获取所述动画元素的第一端与所述可交互区域的第一端之间的第一距离；

获取所述可交互区域的第一端与所述可交互区域的第二端之间的第二距离；

根据所述第一距离与所述第二距离之间的比值确定所述动画元素相对于所述可交互区域的位置信息。

可选地，所述可交互区域包括：可滚动区域、可点击区域、和/或可拖拽区域；所述用户交互操作包括：滚动操作、点击操作、拖拽操作；

所述用户交互操作的操作状态信息包括：操作类型、操作次数、操作幅度。

可选地，所述确定所述页面中与所述动画元素相对应的可交互区域包括：

获取所述页面中的可视区域，当检测到所述可视区域内包含动画元素时，确定与所述动画元素相对应的可交互区域；其中，所述动画元素包括：视频元素和/或动图元素。

根据本发明的另一方面，提供了一种页面中的动画元素的展现装置，包括：

确定模块，适于确定所述页面中与所述动画元素相对应的可交互区域；

获取模块，适于当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；

展现模块，适于根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。

可选地，所述确定模块具体适于：

根据预设的页面结构表，将与所述动画元素相对应的子节点确定为目标子节点；

查询所述页面结构表，将所述目标子节点所对应的节点类型为可交互类型的父节点确定为可交互节点；

将所述可交互节点所对应的页面区域确定为所述与所述动画元素相对应的可交互区域。

可选地，当所述可交互区域为可滚动区域时，所述用户交互操作的操作状态信息包括：滚动方向和/或滚动距离；

则所述展现模块具体适于：根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息；在所述页面中展现所述动画元素中包含的与所述时间进度信息相对应的画面帧。

可选地，所述展现模块具体适于：

根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素相对于所述可交互区域的位置信息；

根据所述位置信息，确定所述动画元素的播放状态信息中包含的时间进度信息。

可选地，所述展现模块具体适于：

获取所述动画元素的第一端与所述可交互区域的第一端之间的第一距离；

获取所述可交互区域的第一端与所述可交互区域的第二端之间的第二距离；

根据所述第一距离与所述第二距离之间的比值确定所述动画元素相对于所述可交互区域的位置信息。

可选地，所述可交互区域包括：可滚动区域、可点击区域、和/或可拖拽区域；所述用户交互操作包括：滚动操作、点击操作、拖拽操作；

所述用户交互操作的操作状态信息包括：操作类型、操作次数、操作幅度。

可选地，所述确定模块具体适于：

获取所述页面中的可视区域，当检测到所述可视区域内包含动画元素时，确定与所述动画元素相对应的可交互区域；其中，所述动画元素包括：视频元素和/或动图元素。

依据本发明的再一方面，提供了一种电子设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行如上述的页面中的动画元素的展现方法对应的操作。

依据本发明的再一方面，提供了一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如上述的页面中的动画元素的展现方法对应的操作。

在本发明提供的页面中的动画元素的展现方法及装置中，首先，确定页面中与动画元素相对应的可交互区域；然后，当监测到与可交互区域相对应的用户交互操作时，获取用户交互操作的操作状态信息；最后，根据操作状态信息确定动画元素的播放状态信息，在页面中按照播放状态信息展现动画元素。该方式能够根据动画元素对应的可交互区域中接收到的用户交互操作来确定动画元素的播放状态信息，从而使动画元素当前所显示的内容能够随着用户交互操作而发生改变，从而有效吸引用户注意力，能够与用户产生互动，进而有利于提升动画元素的曝光点击率。

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

附图说明

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

图1示出了动画元素的常规播放方式的示意图；

图2示出了本发明实施例一提供的一种页面中的动画元素的展现方法的流程图；

图3示出了本发明实施例二提供的一种页面中的动画元素的展现方法的流程图；

图4示出了一种形式的页面结构表的示意图；

图5a示出了动画元素与可交互区域之间的一种位置信息的示意图；

图5b示出了动画元素与可交互区域之间的另一种位置信息的示意图；

图6示出了本发明实施例三提供的一种页面中的动画元素的展现装置的结构示意图；

图7示出了本发明实施例五提供的一种电子设备的结构示意图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。

实施例一

图2示出了本发明实施例一提供的一种页面中的动画元素的展现方法的流程图。如图2所示，该方法包括：

步骤S210：确定页面中与动画元素相对应的可交互区域。

其中，该页面包括各种形式的页面，例如，可以是浏览器中显示的网络页面，也可以是各类应用中显示的应用页面，还可以一些提供交互功能的本地页面，本发明对页面的具体内涵不做限定。动画是指：一组图片在一定的时间内播放完成达到的视觉效果，相应地，页面中的动画元素包括：视频元素、动图元素等各类能够产生动画效果的元素。例如，包括图像互换格式GIF(Graphics Interchange Format)元素等各类元素。

具体地，在确定页面中与动画元素相对应的可交互区域时，可将动画元素所在的、能够与用户产生交互的区域作为该可交互区域，具体确定方式可由本领域技术人员灵活设置。例如，若动画元素本身即可与用户交互，则可以将该动画元素本身作为可交互区域。又如，若动画元素所在的页面局部区域可与用户交互，则可以将该页面局部区域作为可交互区域。

步骤S220：当监测到与可交互区域相对应的用户交互操作时，获取用户交互操作的操作状态信息。

通过上一步骤确定出与动画元素相对应的可交互区域之后，持续监测该可交互区域所对应的用户交互操作。每当监测到与可交互区域相对应的用户交互操作时，获取用户交互操作的操作状态信息。其中，本实施例中的可交互区域包括：可滚动区域、可点击区域、和/或可拖拽区域等各类能够与用户交互的区域；相应地，用户交互操作包括：滚动操作、点击操作、拖拽操作等各种类型的操作；用户交互操作的操作状态信息包括：操作类型、操作次数、操作幅度等。本领域技术人员还可以灵活设置可交互区域的具体类型以及操作状态信息的具体内涵，本发明对此不做限定。

步骤S230：根据操作状态信息确定动画元素的播放状态信息，在页面中按照播放状态信息展现动画元素。

其中，动画元素的播放状态信息与上一步骤中确定的操作状态信息之间存在预设关联关系。该预设关联关系可以为多种，例如，可根据交互操作的次数、类型和/或幅度来确定动画元素的播放状态信息中包含的播放进度信息、播放方式信息、当前画面信息等具体内容。例如，当上一步骤中确定的操作状态信息通过操作幅度的百分比方式确定时，动画元素的播放状态信息中包含通过百分比方式确定的播放进度信息，以便根据用户交互操作来控制动画元素当前播放的内容。另外，还可以预先设置各种类型的交互操作所对应的播放方式。例如，当交互操作为滚动操作时，动画元素的播放状态信息中包含的播放方式为静音播放方式，此时仅展现画面，并播放声音；当交互操作为点击操作时(例如当用户点击可交互区域中的可点击控件/元素时)，动画元素的播放状态信息中包含的播放方式为非静音播放方式，此时不仅展现画面，同时播放画面对应的声音。当然，播放方式还可以为其他方式，例如，播放方式为：在动画元素所在的原始区域进行播放(不改变动画元素所在的区域大小)，或者，在动画元素对应的扩展区域进行播放(增大动画元素所在的区域，以达到突出显示的效果)。又如，播放方式还可以为：以黑白方式播放，或者，以彩色方式播放等等。总之，本领域技术人员可以根据用户交互操作的操作状态信息确定动画元素的播放状态信息，以使动画元素的当前播放内容和播放方式能够随用户的交互操作而发生改变，从而吸引用户注意力，提升互动趣味性。其中，操作状态信息以及播放状态信息的具体内涵和对应关系可由本领域技术人员灵活设置，此处不做限定。

由此可见，该方式能够根据动画元素对应的可交互区域中接收到的用户交互操作来确定动画元素的播放状态信息，从而使动画元素当前所显示的内容能够随着用户交互操作而发生改变，从而有效吸引用户注意力，能够与用户产生互动，进而有利于提升动画元素的曝光点击率。

图3示出了本发明实施例二提供的一种页面中的动画元素的展现方法的流程图。如图3所示，该方法包括：

步骤S310：获取页面中的可视区域，当检测到可视区域内包含动画元素时，确定与动画元素相对应的可交互区域。

本实施例中的页面本身为可上下拖动或左右拖动的长页面，经拖拽后，在终端设备中呈现的页面部分所对应的区域为可视区域，未在终端设备中呈现的页面部分所对应的区域为非可视区域。其中，可视区域与非可视区域的具体内容随用户拖拽操作而实时改变，相应地，在本实施例中，实时监测页面中的可视区域所对应的当前内容，并检测可视区域内是否包含动画元素。具体地，可根据预设的页面结构表确定页面的当前可视区域中包含的各个可视的视图区块以及各个可视的视图区块所对应的视图元素的元素类型，当检测到元素类型为动画类型时，则确定可视区域内包含动画元素。其中，该页面结构表中存储有页面中包含的全部视图区块的标识及位置信息。

具体地，在确定与动画元素相对应的可交互区域时，可通过如下方式实现：首先，根据预设的页面结构表，将与动画元素相对应的子节点确定为目标子节点；然后，查询该页面结构表，将目标子节点所对应的节点类型为可交互类型的父节点确定为可交互节点；最后，将可交互节点所对应的页面区域确定为与动画元素相对应的可交互区域。其中，在上文提到的页面结构表中，进一步存储有各个视图区块所对应的节点标识，即：将各个视图区块转化为各个节点，根据节点之间的父子关系描述视图区块之间的依赖关系。

例如，图4示出了一种形式的页面结构表，该页面结构表中共存储有六个节点，其中，节点5为动画元素，相应地，将节点5确定为目标子节点。其中，节点1为页面的根节点，节点2和节点3为节点1的子节点，节点4和节点5为节点2的子节点。接下来，从目标子节点5开始，依次向上遍历页面结构表，依次确定目标子节点5的各级父节点，每当确定出目标子节点5的一级父节点时，进一步判断当前该级父节点的节点类型是否为可交互类型，若是，则将当前该级父节点作为可交互节点；若否，则进一步确定当前该级父节点的下一级父节点，直至确定出节点类型为可交互类型的父节点。其中，目标子节点5的各级父节点包括：与目标子节点直接相连的一级父节点2一级与目标子节点通过一级父节点2间接相连的二级父节点1。由此可见，目标子节点的父节点包括：一级父节点2以及二级父节点1。具体遍历时，按照与目标子节点之间的距离由近到远的顺序依次遍历各级父节点，直至找到节点类型为可交互类型的父节点。

在本实施例中，可交互区域主要是指：可滚动区域，也叫列表区域(ScrollView)，即：用户界面中用于显示信息的可滚动的区域。相应地，将可滚动类型(也叫ScrollView类型)作为可交互类型。

步骤S320：当监测到与可交互区域相对应的用户交互操作时，获取用户交互操作的操作状态信息。

具体地，可以监听与可交互区域相对应的交互事件，当监测到对应的交互事件时，根据该交互事件的事件类型和事件信息获取用户交互操作的操作状态信息。其中，当可交互区域为可滚动区域时，用户交互操作的操作状态信息主要包括：滚动方向和/或滚动距离。当然，本领域技术人员还可以灵活设置操作状态信息的具体内涵，例如，还可以包括滚动次数、滚动频率、相邻的两次滚动操作之间的时间间隔等。

步骤S330：根据操作状态信息确定动画元素的播放状态信息，在页面中按照播放状态信息展现动画元素。

具体地，根据操作状态信息确定动画元素的播放状态信息时，可通过预设的映射关系确定与操作状态信息相匹配的播放状态信息。该映射关系用于设定操作状态信息的具体数值与播放状态信息的具体数值之间的对应关系，以使动画元素的播放状态能够随用户的交互操作而发生改变。

在本实施例中，当可交互区域为可滚动区域时，可以根据操作状态信息中的滚动方向和/或滚动距离等具体信息，确定动画元素的播放状态信息中包含的时间进度信息，以便在页面中展现动画元素中包含的与该时间进度信息相对应的画面帧。具体地，根据操作状态信息中的滚动方向和/或滚动距离，确定动画元素相对于可交互区域的位置信息；根据该位置信息，确定动画元素的播放状态信息中包含的时间进度信息。相应地，在上述方式中，每当动画元素相对于可交互区域的位置信息随着用户的滑动操作而改变时，该动画元素的播放状态信息中包含的时间进度信息则相应变化，以使动画元素所显示的画面发生变化。具体实施时，在确定动画元素相对于可交互区域的位置信息时，可通过如下方式实现：首先，获取动画元素的第一端与可交互区域的第一端之间的第一距离，其中，当可交互区域为能够竖直滚动的区域时，该第一端可以为顶端或底端；当可交互区域为能够水平滚动的区域时，该第一端可以为左端或右端。然后，获取可交互区域的第一端与可交互区域的第二端之间的第二距离，其中，当可交互区域为能够竖直滚动的区域时，该第一端和第二端可以分别为顶端和底端；当可交互区域为能够水平滚动的区域时，该第一端和第二端可以分别为左端和右端。最后，根据第一距离与第二距离之间的比值确定动画元素相对于可交互区域的位置信息。

例如，图5a示出了动画元素(即图片25对应的区域)与可交互区域之间的一种位置信息的示意图，图5b示出了该动画元素(即图片75对应的区域)与可交互区域之间的另一种位置信息的示意图。其中，图片所在方框为动画元素，屏幕上的其他区域对应于可交互区域。由此可见，在图5a中，响应于用户的滑动操作，动画元素相对于可交互区域的位置信息如下：动画元素的顶部与可交互区域的底部之间的距离与可交互区域的总体高度之间的比值为25％，相应地，可以设置与该操作状态信息相匹配的播放状态信息中的时间进度信息为25％。比如，假设动画元素的总播放时长为8分钟，则时间进度信息25％对应于时间点为2分钟处的画面帧(图5a中的图片25)。同理在图5b中，响应于用户的滑动操作，动画元素相对于可交互区域的位置信息如下：动画元素的顶部与可交互区域的底部之间的距离与可交互区域的总体高度之间的比值为75％，相应地，可以设置与该操作状态信息相匹配的播放状态信息中的时间进度信息为75％。当假设动画元素的总播放时长为8分钟时，则时间进度信息75％对应于时间点为6分钟处的画面帧(图5b中的图片75)。由此可见，在本实施例中，将动画元素相对于可交互区域的位置信息通过百分比方式表示，相应地，将播放状态信息中的时间进度信息也通过百分比方式表示，由此建立操作状态信息与播放状态信息之间的映射关系。具体实施时，当动画元素的顶部处于非可视区域时，其动画进度为0，该动画元素不可见。当用户向上滑动该动画元素所在的可交互区域时，该动画元素随用户的滑动操作而上移，从而使动画元素的顶部处于可视区域内，此时，根据动画元素的顶部的具***置计算该动画元素的时间进度信息，以显示相应的画面帧。在用户继续发出滑动操作之前，动画元素一直显示该画面帧，直至再次接收到用户的滑动操作，由于再次接收到的滑动操作使动画元素的位置继续上移，从而使其顶部的具***置发生改变，相应地，则根据动画元素改变后的位置重新计算该动画元素的时间进度信息，以显示相应的画面帧，从而使动画元素当前显示的画面帧能够随用户发出的交互操作而改变。

综上可知，通过上述方式，能够使动画元素所显示的画面随用户的交互操作而改变，即：通过用户交互动作来控制动画播放进度，让用户与动画产生互动。每当用户发出一次交互操作后，动画元素所显示的画面都会发生改变，从而带给用户耳目一新的视觉体验，进而促使用户继续发出交互操作，以改变动画元素的画面，从而使动画元素与用户之间能够产生互动，提升趣味性。并且，在互动的基础上，更容易激发起用户对于该动画元素的兴趣，进而促使该用户点击该动画元素以查看全部视频信息，有利于提升该动画元素的曝光点击率。在传统方式中，当在列表的一个区块内显示一张图片、GIF、视频时，无法与用户产生互动，无法有效吸引用户的注意力，导致容易被用户忽视，导致整体的点击率偏低。而且区块内千篇一律的图片，容易产生视觉疲劳。通过采用本实施例中的方法，能够实现交互式动画效果，能够优化该场景下的元素展示，吸引用户注意，提高曝光点击率。该方法能够应用于广告栏的投放。当动画元素为广告类元素时，能够有效提升广告的点击量。

实施例三

图6示出了本发明实施例三提供的一种页面中的动画元素的展现装置的结构示意图，该装置包括：

确定模块61，适于确定所述页面中与所述动画元素相对应的可交互区域；

获取模块62，适于当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；

展现模块63，适于根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。

可选地，所述确定模块61具体适于：

根据预设的页面结构表，将与所述动画元素相对应的子节点确定为目标子节点；

查询所述页面结构表，将所述目标子节点所对应的节点类型为可交互类型的父节点确定为可交互节点；

将所述可交互节点所对应的页面区域确定为所述与所述动画元素相对应的可交互区域。

可选地，当所述可交互区域为可滚动区域时，所述用户交互操作的操作状态信息包括：滚动方向和/或滚动距离；

则所述展现模块63具体适于：根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息；在所述页面中展现所述动画元素中包含的与所述时间进度信息相对应的画面帧。

可选地，所述展现模块63具体适于：

根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素相对于所述可交互区域的位置信息；

根据所述位置信息，确定所述动画元素的播放状态信息中包含的时间进度信息。

可选地，所述展现模块63具体适于：

获取所述动画元素的第一端与所述可交互区域的第一端之间的第一距离；

获取所述可交互区域的第一端与所述可交互区域的第二端之间的第二距离；

根据所述第一距离与所述第二距离之间的比值确定所述动画元素相对于所述可交互区域的位置信息。

可选地，所述可交互区域包括：可滚动区域、可点击区域、和/或可拖拽区域；所述用户交互操作包括：滚动操作、点击操作、拖拽操作；

所述用户交互操作的操作状态信息包括：操作类型、操作次数、操作幅度。

可选地，所述确定模块61具体适于：

获取所述页面中的可视区域，当检测到所述可视区域内包含动画元素时，确定与所述动画元素相对应的可交互区域；其中，所述动画元素包括：视频元素和/或动图元素。

关于上述各个模块的具体结构和工作原理可参照方法实施例中相应部分的描述，此处不再赘述。

实施例四

本申请实施例四提供了一种非易失性计算机存储介质，所述计算机存储介质存储有至少一可执行指令，该计算机可执行指令可执行上述任意方法实施例中的页面中的动画元素的展现方法。可执行指令具体可以用于使得处理器执行上述方法实施例中对应的各个操作。

实施例五

图7示出了根据本发明实施例五的一种电子设备的结构示意图，本发明具体实施例并不对电子设备的具体实现做限定。

如图7所示，该电子设备可以包括：处理器(processor)702、通信接口(Communications Interface)706、存储器(memory)704、以及通信总线708。

其中：

处理器702、通信接口706、以及存储器704通过通信总线708完成相互间的通信。

通信接口706，用于与其它设备比如客户端或其它服务器等的网元通信。

处理器702，用于执行程序710，具体可以执行上述页面中的动画元素的展现方法实施例中的相关步骤。

具体地，程序710可以包括程序代码，该程序代码包括计算机操作指令。

处理器702可能是中央处理器CPU，或者是特定集成电路ASIC(ApplicationSpecific Integrated Circuit)，或者是被配置成实施本发明实施例的一个或多个集成电路。电子设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个CPU；也可以是不同类型的处理器，如一个或多个CPU以及一个或多个ASIC。

存储器704，用于存放程序710。存储器704可能包含高速RAM存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。

程序510具体可以用于使得处理器502执行上述方法实施例中对应的各个操作。

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

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

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

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

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

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

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

Claims (10)

1.一种页面中的动画元素的展现方法，包括：

确定所述页面中与所述动画元素相对应的可交互区域；

当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；

根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。

2.根据权利要求1所述的方法，其中，所述确定所述页面中与所述动画元素相对应的可交互区域包括：

根据预设的页面结构表，将与所述动画元素相对应的子节点确定为目标子节点；

查询所述页面结构表，将所述目标子节点所对应的节点类型为可交互类型的父节点确定为可交互节点；

将所述可交互节点所对应的页面区域确定为所述与所述动画元素相对应的可交互区域。

3.根据权利要求1或2所述的方法，其中，当所述可交互区域为可滚动区域时，所述用户交互操作的操作状态信息包括：滚动方向和/或滚动距离；

则所述根据所述操作状态信息确定所述动画元素的播放状态信息包括：根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息；

则所述在所述页面中按照所述播放状态信息展现所述动画元素包括：在所述页面中展现所述动画元素中包含的与所述时间进度信息相对应的画面帧。

4.根据权利要求3所述的方法，其中，所述根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素的播放状态信息中包含的时间进度信息包括：

根据所述操作状态信息中的滚动方向和/或滚动距离，确定所述动画元素相对于所述可交互区域的位置信息；

根据所述位置信息，确定所述动画元素的播放状态信息中包含的时间进度信息。

5.根据权利要求4所述的方法，其中，所述确定所述动画元素相对于所述可交互区域的位置信息包括：

获取所述动画元素的第一端与所述可交互区域的第一端之间的第一距离；

获取所述可交互区域的第一端与所述可交互区域的第二端之间的第二距离；

根据所述第一距离与所述第二距离之间的比值确定所述动画元素相对于所述可交互区域的位置信息。

6.根据权利要求1-5任一所述的方法，其中，所述可交互区域包括：可滚动区域、可点击区域、和/或可拖拽区域；所述用户交互操作包括：滚动操作、点击操作、拖拽操作；

所述用户交互操作的操作状态信息包括：操作类型、操作次数、操作幅度。

7.根据权利要求1-6任一所述的方法，其中，所述确定所述页面中与所述动画元素相对应的可交互区域包括：

获取所述页面中的可视区域，当检测到所述可视区域内包含动画元素时，确定与所述动画元素相对应的可交互区域；其中，所述动画元素包括：视频元素和/或动图元素。

8.一种页面中的动画元素的展现装置，包括：

确定模块，适于确定所述页面中与所述动画元素相对应的可交互区域；

获取模块，适于当监测到与所述可交互区域相对应的用户交互操作时，获取所述用户交互操作的操作状态信息；

展现模块，适于根据所述操作状态信息确定所述动画元素的播放状态信息，在所述页面中按照所述播放状态信息展现所述动画元素。

9.一种电子设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行如权利要求1-7中任一项所述的页面中的动画元素的展现方法对应的操作。

10.一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行如权利要求1-7中任一项所述的页面中的动画元素的展现方法对应的操作。