一种图片呈现的方法以及图片呈现装置制造方法及图纸

本发明专利技术实施例公开了一种图片呈现的方法以及图片呈现装置，用于当用户打开网页时，提高用户的视觉体验。本发明专利技术实施例方法包括：将图片容器覆盖于加载框上方，加载框用于加载目标图片的原图，图片容器与加载框属于浏览器中的元素，通过图片容器对原图的数据进行压缩处理，得到目标图片的预览图，预览图呈现于图片容器中，且预览图的尺寸与原图一致，然后通过加载框判断原图是否加载完成，如果加载完成，则对图片容器执行隐藏操作，使得原图呈现。也就是说，用户在等待目标图片的原图在加载时，在目标图片原图的位置会显示与原图对应尺寸的预览图，用户在等待原图加载的时候能看到与原图相对应的预览图，使得用户打开网页时，提高用户的视觉体验。

Picture presentation method and picture presentation device

The embodiment of the invention discloses a picture presentation method and a picture presentation device for improving the user's visual experience when a user opens a web page. The embodiment of the invention comprises: loading containers covered on the picture above the frame, the loading box for loading the original target picture, picture frame and container loading is a browser element in the container through the picture of the original image data compression, target image preview, preview picture appears on the container, and preview the size is consistent with the original image, and then determine whether the original frame by loading is loaded, if the completion of the loading of containers, picture is hidden, making the original presentation. That is to say, in the original picture of the target user waiting at load time, in the original position of the target image will be displayed with the original size corresponding to the preview, the user can see the corresponding image preview when waiting for the original loading, allows the user to open a web page, to improve the user's visual experience.

【技术实现步骤摘要】
一种图片呈现的方法以及图片呈现装置
本专利技术涉及网页前端设计领域，具体涉及一种图片呈现的方法以及图片呈现装置。
技术介绍
随着计算机技术以及浏览器技术的快速发展，万维网Web前端应用发展得越发复杂与庞大。图片资源作为应用评价指标之一，与用户的交互越来越密切。当浏览器频繁载入大量高质量图片资源时，用户不得不被动的面对停滞的浏览器页面以等待资源加载完毕。当网络受到影响甚至中断的时候，会导致最终图片资源渲染失败或者页面呈现不完整等结果。这些都会使得用户受到不同程度的负面体验。在现有技术中，通过加载等待动画过场特效使得用户的注意力得以转移，虽然该方法或可间接延长用户耐心度，但是当诸多图片同时加载的时候，会影响页面整体观赏性和一致性，并且始终单一的动画无法从根本上挽救用户体验，导致用户打开网页时，视觉体验低。
技术实现思路
本专利技术实施例提供了一种图片呈现的方法以及图片呈现装置，用于当用户打开网页时，提高用户的视觉体验。本专利技术实施例第一方面提供了一种图片呈现的方法，具体包括：将图片容器覆盖于加载框上方，加载框用于加载目标图片的原图，图片容器与加载框属于浏览器中的元素；通过图片容器对原图的数本文档来自技高网...

【技术保护点】
一种图片呈现的方法，其特征在于，包括：将图片容器覆盖于加载框上方，所述加载框用于加载目标图片的原图，所述图片容器与所述加载框属于浏览器中的元素；通过所述图片容器对所述原图的数据进行压缩处理，得到所述目标图片的预览图，所述预览图呈现于所述图片容器中，且所述预览图的尺寸与所述原图一致；通过所述加载框判断所述原图是否加载完成；若加载完成，则对所述图片容器执行隐藏操作，使得所述原图呈现。

【技术特征摘要】
1.一种图片呈现的方法，其特征在于，包括：将图片容器覆盖于加载框上方，所述加载框用于加载目标图片的原图，所述图片容器与所述加载框属于浏览器中的元素；通过所述图片容器对所述原图的数据进行压缩处理，得到所述目标图片的预览图，所述预览图呈现于所述图片容器中，且所述预览图的尺寸与所述原图一致；通过所述加载框判断所述原图是否加载完成；若加载完成，则对所述图片容器执行隐藏操作，使得所述原图呈现。2.根据权利要求1所述的方法，其特征在于，所述对所述图片容器执行隐藏操作包括：接收用户的隐藏指令；根据所述隐藏指令对所述图片容器执行隐藏操作。3.根据权利要求1所述的方法，其特征在于，所述对所述图片容器执行隐藏操作包括：接收加载完成指令，所述加载完成指令根据所述加载框判断所述原图加载完成时生成；将所述加载完成指令反馈至所述图片容器，所述图片容器根据所述加载完成指令对所述图片容器执行隐藏操作。4.根据权利要求1至3中任一项所述的方法，其特征在于，所述通过所述图片容器对所述原图的数据进行压缩处理之前，所述方法还包括：接收所述原图的数据。5.根据权利要求1至3中任一项所述的方法，其特征在于，所述将图片容器覆盖于加载框上方包括：确定所述加载框在网页中的位置信息；根据所述位置信息将所述图片容器覆盖于所述加载框上方。6.一种图片呈现装置，其特征在于，包括：覆盖单元，用于将图片容器覆盖于加载框上方，所述加载框用于加载目标图片的...

【专利技术属性】
技术研发人员：唐臻，颜秉珩，王理想，
申请(专利权)人：郑州云海信息技术有限公司，
类型：发明
国别省市：河南,41