一种浮动层设置方法、装置及电子设备的制造方法
【技术领域】
[0001]本发明涉及数据处理技术领域，更具体地说，涉及一种浮动层设置方法、装置及电子设备。
【背景技术】
[0002]浮动层为网页效果中的一种形式，其表现样式为始终显示在屏幕的特定位置上，不跟随鼠标的滚动而滚动以达到强调其内容或者衔接上下文解释说明的效果。hover浮动层为一种可在鼠标移动到浮动层位置，则显示，鼠标移出浮动层位置，则隐藏的浮动层；即hover浮动层可在mouseover事件触发时显示，在mouseout事件触发时隐藏。
[0003]hover是指:一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法。这是一个自定义的方法，它为频繁使用的任务提供了一种“保持在其中”的状态，当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数，当鼠标移出这个元素时，会触发指定的第二个函数；而且，会伴随着对鼠标是否仍然处在特定元素中的检测(例如，处在div中的图像)，如果是，则会继续保持“悬停”状态，而不触发移出事件。
[0004]本发明的发明人在研究过程中发现:在hover浮动层的展示过程中,hover浮动层经常会出现浮动层内信息排布杂乱的情况，如mouseover事件触发后,hover浮动层常会出现浮动层内信息排布杂乱的情况；因此提供一种浮动层设置方法以解决现有浮动层内信息排布杂乱的问题，成为本领域技术人员亟需解决的问题。
【发明内容】
[0005]有鉴于此，本发明实施例提供一种浮动层设置方法、装置及电子设备，以解决现有技术存在的浮动层内信息排布杂乱的问题。
[0006]为实现上述目的，本发明实施例提供如下技术方案:
[0007]—种浮动层设置方法，包括:
[0008]对浮动层的各结构区域进行信息配置，得到预定接口的输入参数，所述输入参数为浮动层的配置参数；
[0009]调用预定接口 ；
[0010]实现所述预定接口的功能，以对所述配置参数进行解析处理，对解析得到的与所述配置参数对应的浮动层html元素进行事件注册，对进行事件注册后的浮动层进行渲染处理，完成浮动层的设置。
[0011]本发明实施例还提供一种浮动层设置装置，包括:
[0012]配置模块，用于对浮动层的各结构区域进行信息配置，得到预定接口的输入参数，所述输入参数为浮动层的配置参数；
[0013]调用模块，用于调用预定接口 ；
[0014]实现模块，用于实现所述预定接口的功能，以对所述配置参数进行解析处理，对解析得到的与所述配置参数对应的浮动层html元素进行事件注册，对进行事件注册后的浮动层进行渲染处理，完成浮动层的设置。
[0015]本发明实施例还提供一种电子设备，包括上述所述的浮动层设置装置。
[0016]基于上述技术方案，本发明实施例提供的浮动层设置方法，在对浮动层的各结构区域进行信息配置，得到浮动层的配置参数后，可通过重新梳理并设计的预定接口以所述配置参数作为输入参数实现预定接口的功能，从而完成浮动层的设置。本发明实施例提供的浮动层设置方法，将完成浮动层设置所需的解析处理、事件注册和渲染处理过程统一到一个预定接口中，将浮动层的配置参数作为预定接口的输入参数，通过实现预定接口的功能，完成对配置参数进行解析处理，对解析得到的与所述配置参数对应的浮动层html元素进行事件注册，对进行事件注册后的浮动层进行渲染处理的过程，从而完成浮动层内信息的规范设置；并且本发明实施例可根据不同的浮动层配置参数，定制不同的浮动层结构，完成不同的浮动层的设置，使得浮动层可展现不同的UI，定制不同的功能，适应不同应用场景。本发明实施例提供的浮动层设置方法实现了浮动层内信息的规范设置，解决了解决现有浮动层内信息排布杂乱的问题；同时，可根据不同的浮动层配置参数，使得浮动层可展现不同的UI,定制不同的功能,适应不同应用场景。
【附图说明】
[0017]为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。
[0018]图1为本发明实施例提供的浮动层设置方法的流程图；
[0019]图2为对浮动层的各结构区域进行信息配置的示意图；
[0020]图3为本发明实施例提供的预定接口的功能实现流程图；
[0021]图4为本发明实施例提供的浮动层展示示意图；
[0022]图5为本发明实施例提供的浮动层设置方法的另一流程图；
[0023]图6为本发明实施例提供的浮动层设置装置的结构框图；
[0024]图7为本发明实施例提供的实现模块的结构框图；
[0025]图8为本发明实施例提供的解析单元的结构框图；
[0026]图9为本发明实施例提供的注册单元的结构框图；
[0027]图10为本发明实施例提供的电子设备的硬件结构框图。
【具体实施方式】
[0028]下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
[0029]图1为本发明实施例提供的浮动层设置方法的流程图，该方法可应用于电子设备中，电子设备可以为智能终端设备(如笔记本电脑等)，服务器等，参照图1，该方法可以包括:
[0030]步骤S100、对浮动层的各结构区域进行信息配置，得到预定接口的输入参数，所述输入参数为浮动层的配置参数；
[0031]步骤S110、调用预定接口；
[0032]步骤S120、实现所述预定接口的功能，以对所述配置参数进行解析处理，对解析得到的与所述配置参数对应的浮动层html (HyperText Markup language,超文本标记语言)元素进行事件注册，对进行事件注册后的浮动层进行渲染处理，完成浮动层的设置。
[0033]可选的，进行渲染处理后的浮动层可以在网页中进行展示。
[0034]本发明实施例提供的浮动层设置方法，在对浮动层的各结构区域进行信息配置，得到浮动层的配置参数后，可通过重新梳理并设计的预定接口以所述配置参数作为输入参数实现预定接口的功能，从而完成浮动层的设置。本发明实施例提供的浮动层设置方法，将完成浮动层设置所需的解析处理、事件注册和渲染处理过程统一到一个预定接口中，将浮动层的配置参数作为预定接口的输入参数，通过实现预定接口的功能，完成对配置参数进行解析处理，对解析得到的与所述配置参数对应的浮动层html元素进行事件注册，对进行事件注册后的浮动层进行渲染处理的过程，从而完成浮动层内信息的规范设置；并且本发明实施例可根据不同的浮动层配置参数，定制不同的浮动层结构，完成不同的浮动层的设置，使得浮动层可展现不同的UI (User Interface,用户界面)，定制不同的功能，适应不同应用场景。本发明实施例提供的浮动层设置方法实现了浮动层内信息的规范设置，解决了解决现有浮动层内信息排布杂乱的问题；同时，可根据不同的浮动层配置参数，使得浮动层可展现不同的UI，定制不同的功能，适应不同应用场景。
[0035]可选的，对浮动层的各结构区域进行信息配置的过程可为，对浮动层的head区域(头部区域)进行信息配置，对body区域(身体区域)进行信息配置，对footer区域(尾部区域)进行信息配置。
[0036]可选的，对浮动层的head区域进行信息配置包括在head区域对浮动层所要展示的对象的主题名称进行配置；对body区域进行信息配置包括在body区域对浮动层所要展示对象的具体内容进行配置；对footer区域进行信息配置包括在footer区域对浮动层所要展示对象的业务处理内容进行配置。可选的，本发明实施例还可在ex区域对浮动层类名，偏移量等信息进行配置。对应的，图2示出了一种对衣服进行展示的浮动层的各结构区域进行信息配置的示意图，可进行参照。
[0037]可选的，对浮动层的各结构区域进行信息配置的过程在JS中可认为是一个对象，配置得到的浮动层的配置参数传递给预定接口作为输入参数
[0038]可选的，本发明实施例可定义预定接口为QS.1tem, detail接口 ；为便于描述，图3示出了预定接口的功能实现流程图，参照图3，该流程可以包括:
[0039]步骤S200、对浮动层的配置参数进行解析，得到与所述配置参数对应的浮动层html元素；
[0040]可选的，具体的解析方式可采用递归解析，本发明实施例可对浮动层的配置参数进行递归解析处理，得到与所述配置参数对应的浮动层html元素。
[0041]可选的，本发明实施例可根据浮动层数据和功能模板碎片对浮动层的配置参数进行递归解析处理；其中，浮动层数据定义了具体业务需要的数据，如:浮动层上的图片地址等；功能模板碎片可认为是一个html结构片段，html结构片段中的预置位置的数据为需要用浮动层数据替换的数据，如html结构片段中〈％ XXXX% >之间的数据为需要用浮动层数据替换的数据；可选的，功能模板碎片在必要时也会对数据做相应的逻辑处理。
[0042]步骤S210、对所述浮动层html元素进行事件注册；
[0043]可选的，本发明实施例可通过事件代理的方式对浮动层html元素进行事件注册，从而方便事件处理，不用每个按钮点击对象都绑定事件；具体的，本发明实施例可将事件通过event-type (事件类型)属性定义在html元素上，并通过冒泡方式对事件进行捕获，以执行事件对应的命令。
[0044]步骤S220、对进行事件注册后的浮动层进行渲染处理，完成浮动层的设置。
[0045]可选的，图4示出了图2所示配置所对应的浮动层展示示意图,可进行参照。值得注意的是，本发明实施例提供的浮动层设置方法还可应用于其他对象的展示，并不一定限于衣服的展示。
[0046]可选的，图5示出了本发明实施例提供的浮动层设置方法的另一流程图，参照图5，该方法可以包括:
[0047]步骤S300、对浮动层的head区域进行信息配置,对body区域进行信息配置,对footer区域进行信息配置，和对ex区域进行信息配置，得到预定接口的输入参数，所述输入参数为浮动层的配置参数；
[0048]步骤S310、调用预定接口；
[0049]步骤S320、通过预定接口，根据浮动层数据和功能模板碎片对浮动层的配置参数进行递归解析处理，得到与所述