网页显示的方法和装置制造方法及图纸

技术编号:22363715 阅读:42 留言:0更新日期:2019-10-23 04:34
本申请实施例公开了网页显示的方法和装置。该方法的一具体实施方式包括:响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在网页中的第一位置信息;基于第一位置信息,创建显示部分的截图层,以使截图层覆盖显示部分;弹出待弹出浮层,以使待弹出浮层呈现在截图层之上。该实施方式可以使得网页在弹出浮层时,在显示窗口显示的网页内容保持不变。

Methods and devices of web page display

【技术实现步骤摘要】
网页显示的方法和装置
本申请实施例涉及计算机
,具体涉及网页显示的方法和装置。
技术介绍
随着前端技术的发展和对用户体验的重视,越来越多的网页选择使用浮层交互,比如在网页的浮层上展示对话框、图片等等。而使用浮层交互通常会面临一个严重的问题,就是在浮层上滑动手指(或鼠标),整个网页也会跟随滑动。因此,我们需要寻找一种既不会影响浮层滑动又可以锁定网页滚动的方案。现有技术中,在利用锁定网页滚动的方案锁定网页时,网页通常会出现回滚到顶端后才会被锁定的现象,而用户在网页锁定的过程会明显得感知到浏览器中网页位置的变化。
技术实现思路
本申请实施例提出了网页显示的方法和装置。第一方面,本申请实施例提供了一种网页显示的方法,该方法包括:响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在网页中的第一位置信息;基于第一位置信息,创建显示部分的截图层,以使截图层覆盖显示部分;弹出待弹出浮层,以使待弹出浮层呈现在截图层之上。在一些实施例中,在弹出待弹出浮层之前,方法还包括:对网页的HTML标签进行解析,获取预设的层叠式样式表CSS信息以固定该网页,其中,CSS信息携带有禁止该网页滚动的属性信息。在一些实施例中,方法还包括:响应于接收到关闭浮层的指令,基于第一位置信息设置显示窗口显示网页的显示部分,移除截图层,关闭所弹出的浮层。在一些实施例中,基于第一位置信息,创建显示部分的截图层,以使截图层覆盖显示部分,包括:创建指定尺寸的画布Canvas,其中,指定尺寸为显示窗口的尺寸;利用网页的HTML代码,生成矢量图形;基于第一位置信息,将矢量图形绘制到画布Canvas以生成截图层;将截图层固定在网页所在的图层之上,以使显示窗口显示截图层。在一些实施例中,响应于接收到关闭浮层的指令,基于第一位置信息设置显示窗口显示网页的显示部分,移除截图层,关闭所弹出的浮层,包括:响应于接收到关闭浮层的指令,移除CSS信息;将网页滚动到第一位置信息所指示的位置处;移除截图层,隐藏或移除所弹出的浮层。第二方面,本申请实施例提供了一种网页显示的装置,装置包括:第一位置信息获取单元,配置用于响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在网页中的第一位置信息;截图层创建单元,配置用于基于第一位置信息,创建显示部分的截图层,以使截图层覆盖显示部分;浮层弹出单元,配置用于弹出待弹出浮层,以使待弹出浮层呈现在截图层之上。在一些实施例中,装置还包括:CSS信息获取单元,配置用于对网页的HTML标签进行解析,获取预设的层叠式样式表CSS信息以固定该网页,其中,CSS信息携带有禁止该网页滚动的属性信息。在一些实施例中,装置还包括:浮层关闭单元,配置用于响应于接收到关闭浮层的指令,基于第一位置信息设置显示窗口显示网页的显示部分,移除截图层,关闭所弹出的浮层。在一些实施例中,截图层创建单元进一步配置用于:创建指定尺寸的画布Canvas,其中,指定尺寸为显示窗口的尺寸;利用网页的HTML代码,生成矢量图形;基于第一位置信息,将矢量图形绘制到画布Canvas以生成截图层;将截图层固定在网页所在的图层之上,以使显示窗口显示截图层。在一些实施例中,浮层关闭单元进一步配置用于:响应于接收到关闭浮层的指令,移除CSS信息;将网页滚动到第一位置信息所指示的位置处;移除截图层,隐藏或移除所弹出的浮层。本申请实施例提供的网页显示的方法和装置,响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在该网页中的第一位置信息,而后基于第一位置信息创建网页的显示部分的截图层,并使得该截图层可以覆盖显示部分,最后弹出待弹出浮层以使该待弹出浮层呈现在截图层之上,从而使得显示窗口在弹出浮层时显示的内容保持不变。附图说明通过阅读参照以下附图所作的对非限制性实施例所作的详细描述,本申请的其它特征、目的和优点将会变得更明显:图1是本申请可以应用于其中的示例性系统架构图;图2是根据本申请的网页显示的方法的一个实施例的流程图;图3是根据本申请的网页显示的方法的一个应用场景的示意图;图4是根据本申请的网页显示的方法的另一个实施例的流程图;图5是根据本申请的网页显示的装置的一个实施例的结构示意图;图6是适于用来实现本申请实施例的电子设备的计算机系统的结构示意图。具体实施方式下面结合附图和实施例对本申请作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释相关专利技术,而非对该专利技术的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与有关专利技术相关的部分。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。下面将参考附图并结合实施例来详细说明本申请。图1示出了可以应用本申请的网页显示的方法或网页显示的装置的实施例的示例性系统架构100。如图1所示,系统架构100可以包括终端设备101、102、103,网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型,例如有线、无线通信链路或者光纤电缆等等。用户可以使用终端设备101、102、103通过网络104与服务器105交互,以接收或发送消息等。终端设备101、102、103上可以安装有各种通讯客户端应用,例如网页浏览器应用、购物类应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等。终端设备101、102、103可以是具有显示屏并且支持网页浏览的各种电子设备,包括但不限于智能手机、平板电脑、电子书阅读器、MP3播放器(MovingPictureExpertsGroupAudioLayerIII,动态影像专家压缩标准音频层面3)、MP4(MovingPictureExpertsGroupAudioLayerIV,动态影像专家压缩标准音频层面4)播放器、膝上型便携计算机和台式计算机等等。服务器105可以是提供各种服务的服务器,例如对终端设备101、102、103上显示的网页提供支持的后台网页服务器。后台网页服务器可以对网页数据等进行分析等处理,并将处理结果(例如网页页面)反馈给终端设备。需要说明的是,本申请实施例所提供的网页显示的方法一般由服务器105执行,相应地,网页显示的装置一般设置于服务器105中。需要指出的是,本申请实施例所提供的网页显示的方法还可以由终端设备101、102、103执行,相应地,图像生成装置也可以设置于终端设备101、102、103中。应该理解,图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要,可以具有任意数目的终端设备、网络和服务器。继续参考图2,示出了根据本申请的网页显示的方法的一个实施例的流程200。该网页显示的方法,包括以下步骤:步骤201,响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在网页中的第一位置信息。在本实施例中,网页显示的方法运行于其上的电子设备(例如图1所示的服务器)可以用过有线连接或者无线连接方式从用户利用其进行网页浏览的的终端获取用户浏览的网页,而后确定用户所浏览的网页否存在待弹出浮层。响应于检测到用户所浏览的网页中存在待弹出浮层,可以确定该网页中呈现在显示窗口的显示部分,从而获取该显示部分在网页中位置信息,该位置信息即为第一位置信本文档来自技高网...

【技术保护点】
1.一种网页显示的方法,包括:响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在所述网页中的第一位置信息;基于所述第一位置信息,创建所述显示部分的截图层,以使所述截图层覆盖所述显示部分;弹出所述待弹出浮层,以使所述待弹出浮层呈现在所述截图层之上。

【技术特征摘要】
1.一种网页显示的方法,包括:响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在所述网页中的第一位置信息;基于所述第一位置信息,创建所述显示部分的截图层,以使所述截图层覆盖所述显示部分;弹出所述待弹出浮层,以使所述待弹出浮层呈现在所述截图层之上。2.根据权利要求1所述的方法,其中,在弹出所述待弹出浮层之前,所述方法还包括:对所述网页的HTML标签进行解析,获取预设的层叠式样式表CSS信息以固定该网页,其中,所述CSS信息携带有禁止该网页滚动的属性信息。3.根据权利要求2所述的方法,其中,所述方法还包括:响应于接收到关闭浮层的指令,基于所述第一位置信息设置所述显示窗口显示所述网页的显示部分,移除所述截图层,关闭所弹出的浮层。4.根据权利要求1所述的方法,其中,所述基于所述第一位置信息,创建所述显示部分的截图层,以使所述截图层覆盖所述显示部分,包括:创建指定尺寸的画布Canvas,其中,所述指定尺寸为所述显示窗口的尺寸;利用所述网页的HTML代码,生成矢量图形;基于所述第一位置信息,将所述矢量图形绘制到所述画布Canvas以生成所述截图层;将所述截图层固定在所述网页所在的图层之上,以使所述显示窗口显示所述截图层。5.根据权利要求3所述的方法,其中,所述响应于接收到关闭浮层的指令,基于所述第一位置信息设置所述显示窗口显示所述网页的显示部分,移除所述截图层,关闭所弹出的浮层,包括:响应于接收到关闭所述浮层的指令,移除所述CSS信息;将所述网页滚动到所述第一位置信息所指示的位置处;移除所述截图层,隐藏或移除所弹出的浮层。6.一种网页显示的装置,包括:第一位置信息获取单元,配置用于响应于检测到待弹出浮层,获取网页中呈现在显示窗口的显示部分在所述...

【专利技术属性】
技术研发人员:李非凡
申请(专利权)人:北京京东尚科信息技术有限公司北京京东世纪贸易有限公司
类型:发明
国别省市:北京,11

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1