一种网页中的图片的适配方法和装置的制造方法

文档序号:9326979阅读:298来源:国知局
一种网页中的图片的适配方法和装置的制造方法
【技术领域】
[0001] 本发明涉及互联网技术领域,具体涉及一种网页中图片的适配方法和装置。
【背景技术】
[0002] 随着科技的不断进步,用于浏览互联网页面的终端设备的种类日益增多,除了使 用传统的PC机,用户也越来越频繁地通过各种型号的手机、上网本、PAD等终端设备来浏览 网页。在这种形势下,由于各种终端设备的显示参数的不同,传统的网页中图片的固定宽度 设计显得愈发不合理,无法满足用户的浏览需求。
[0003] 因此,如何使得终端设备上的浏览器在加载网页时,网页中的图片在保证图片信 息完整不失真的前提下适配于当前终端设备而显示,是目前亟待解决的问题,对于跨平台 跨设备浏览网页的用户来说具有重要的意义。

【发明内容】

[0004] 鉴于上述问题,提出了本发明以便提供一种克服上述问题或者至少部分地解决上 述问题的一种网页中的图片的适配方法和相应的装置。
[0005] 依据本发明的一个方面,提供了一种网页中的图片的适配方法,该方法包括:
[0006] 接收终端设备上的浏览器发送的获取指定网页的请求;
[0007] 获取用于将指定网页中的原图片与所述终端设备的显示参数进行适配处理的代 码包;
[0008] 将所述代码包返回给所述终端设备上的浏览器;这使得所述终端设备上浏览器执 行所述代码包将指定网页中的原图片与所述终端设备的显示参数进行适配处理,并渲染加 载包含经所述代码包处理后的图片的指定网页。
[0009] 可选地,该方法进一步包括:
[0010] 生成用于获取终端的显示参数,以及将网页中的原图片与终端设备的显示参数进 行适配处理得到处理后的图片的处理代码,并保存该处理代码;
[0011] 获取并保存各个网页中的原图的图片参数。
[0012] 可选地,获取用于将指定网页中的原图片与所述终端设备的显示参数进行适配处 理的代码包包括:
[0013] 将所述处理代码,以及所述指定网页中的原图片的图片参数打包为一个代码包。
[0014] 可选地,获取用于将指定网页中的原图片与所述终端设备的显示参数进行适配处 理的代码包包括:
[0015] 将所述处理代码,以及所述指定网页所属网站的包括所述指定网页在内的所有或 部分网页中的原图片的图片参数打包为一个代码包。
[0016] 可选地,所述代码包在执行时执行如下步骤:
[0017] 获取终端设备的显示参数,以及获取指定页面中的原图片的图片参数;
[0018] 依据终端设备的显示参数和指定页面中的原图片的图片参数,将指定页面中的原 图片处理为与终端设备的显示参数适配的图片。
[0019] 可选地,获取终端设备的显示参数,以及获取指定页面中的原图片的图片参数包 括:获取终端设备的HTML宽度,以及获取指定页面中的原图片的宽度值和字体大小值;
[0020] 依据终端设备的显示参数和指定页面中的原图片的图片参数,将指定页面中的原 图片处理为与终端设备的显示参数适配的图片包括:依据终端设备的HTML宽度与原图片 宽度的比值与终端设备侧字体大小值与原图片字体大小值的比值相等的条件,获得终端设 备侧字体大小值;
[0021] 设置终端设备侧表示高度的单位值等于所获得的终端设备侧字体大小值;
[0022] 依据原图片中的指定元素在原图片中的宽度比例,获得该指定元素在终端设备上 显示时的宽度值,以及根据终端设备侧表示高度的单位值确定该指定元素在终端设备上显 示的高度值。
[0023] 根据本发明的另一方面,提供了一种网页中的图片的适配装置,该装置包括:
[0024] 接收单元,适于接收终端设备上的浏览器发送的获取指定网页的请求;
[0025] 代码包获取单元,适于获取用于将指定网页中的原图片与所述终端设备的显示参 数进行适配处理的代码包;
[0026] 返回单元,适于将所述代码包返回给所述终端设备上的浏览器;这使得所述终端 设备上浏览器执行所述代码包将指定网页中的原图片与所述终端设备的显示参数进行适 配处理,并渲染加载包含经所述代码包处理后的图片的指定网页。
[0027] 可选地,该装置进一步包括:
[0028] 代码生成单元,适于生成用于获取终端的显示参数,以及将网页中的原图片与终 端设备的显示参数进行适配处理得到处理后的图片的处理代码,并保存该处理代码;
[0029] 参数获取单元,适于获取并保存各个网页中的原图的图片参数。
[0030] 可选地,所述代码包获取单元,适于将所述处理代码,以及所述指定网页中的原图 片的图片参数打包为一个代码包。
[0031] 可选地,所述代码包获取单元,适于将所述处理代码,以及所述指定网页所属网站 的包括所述指定网页在内的所有或部分网页中的原图片的图片参数打包为一个代码包。
[0032] 可选地,所述代码包获取单元获取的所述代码包在执行时执行如下步骤:
[0033] 获取终端设备的显示参数,以及获取指定页面中的原图片的图片参数;
[0034] 依据终端设备的显示参数和指定页面中的原图片的图片参数,将指定页面中的原 图片处理为与终端设备的显示参数适配的图片。
[0035] 可选地,所述代码包获取单元获取的所述代码包在执行时进一步具体执行如下步 骤:
[0036] 获取终端设备的HTML宽度,以及获取指定页面中的原图片的宽度值和字体大小 值;
[0037] 依据终端设备的HTML宽度与原图片宽度的比值与终端设备侧字体大小值与原图 片字体大小值的比值相等的条件,获得终端设备侧字体大小值;
[0038] 设置终端设备侧表示高度的单位值等于所获得的终端设备侧字体大小值;
[0039] 依据原图片中的指定元素在原图片中的宽度比例,获得该指定元素在终端设备上 显示时的宽度值,以及根据终端设备侧表示高度的单位值确定该指定元素在终端设备上显 示的高度值。
[0040] 由上述可知,本发明提供的技术方案响应于终端设备对网页的请求,将用于将网 页中的原图片与终端设备的显示参数进行适配处理的代码包返回给终端设备,由终端设备 上的浏览器通过执行该代码包对网页中的原图片进行适配处理,然后再渲染加载处理后的 网页,使得终端设备上的浏览器在加载网页时,网页中的图片在保证图片信息完整不失真 的前提下适配于当前终端设备而显示,符合用户的浏览需求,大幅提升用户体验。
[0041] 上述说明仅是本发明技术方案的概述,为了能够更清楚了解本发明的技术手段, 而可依照说明书的内容予以实施,并且为了让本发明的上述和其它目的、特征和优点能够 更明显易懂,以下特举本发明的【具体实施方式】。
【附图说明】
[0042] 通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通 技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本发明 的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:
[0043] 图1示出了根据本发明一个实施例的一种网页中的图片的适配方法的流程图;
[0044] 图2示出了根据本发明一个实施例的一种网页中的图片的适配装置的示意图;
[0045] 图3示出了根据本发明另一个实施
当前第1页1 2 3 4 
网友询问留言 已有0条留言
  • 还没有人留言评论。精彩留言会获得点赞!
1