热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

实现同时加载大量大图里,由马马赛克变清晰过程方法

打开一些网上的相册,在加载照片的时候,如果网速比较慢加载慢的话,它会先显示一个类似模糊有点小马赛克的质量比较差的照片,然后慢慢的变为清晰的照片,这样避免了用户在浏览照片的时候页面一片空白的情况,

打开一些网上的相册,在加载照片的时候,如果网速比较慢加载慢的话,它会先显示一个类似模糊有点小马赛克的质量比较差的照片,然后慢慢的变为清晰的照片,这样避免了用户在浏览照片的时候页面一片空白的情况,在html中 IMG 有个 lowsrc 属性

把图片的缩略图 放在lowsrc里面,这样的话因为缩略图是缩小的,按照原图片的比例显示就会有马赛克!
src里填写 原图片!
这样的话,原图片比较大,下载的慢,lowsrc的缩略图小加载快,所以会先显示被拉伸的缩略图,等大图下载完成后会显示原图,这样有个时间差,就是出现先由马赛克,然后变清晰的效果!
注意,测试的时候最好在远程服务器上,这样效果比较明显,本机的话,下载太快了,可能感觉不出来!


推荐阅读
  • 探索OpenWrt中的LuCI框架
    本文深入探讨了OpenWrt系统中轻量级HTTP服务器uhttpd的工作原理及其配置,重点介绍了LuCI界面的实现机制。 ... [详细]
  • 本文详细介绍了跨站脚本攻击(XSS)的基本概念、工作原理,并通过实际案例演示如何构建XSS漏洞的测试环境,以及探讨了XSS攻击的不同形式和防御策略。 ... [详细]
  • 在创建带有左侧图标的按钮时,遇到了文本与图标对齐的问题。本文提供了几种使用Bootstrap 4解决此问题的方法。 ... [详细]
  • 解决远程桌面连接时的身份验证错误问题
    本文介绍了如何解决在尝试远程访问服务器时遇到的身份验证错误,特别是当系统提示‘要求的函数不受支持’时的具体解决步骤。通过调整Windows注册表设置,您可以轻松解决这一常见问题。 ... [详细]
  • Redis: 高效的键值存储系统
    Redis是一款遵循BSD许可的开源高性能键值存储系统,它不仅支持多种数据类型的存储,还提供了数据持久化和复制等功能,显著区别于其他键值缓存解决方案。 ... [详细]
  • 本文介绍了一个基本的同步Socket程序,演示了如何实现客户端与服务器之间的简单消息传递。此外,文章还概述了Socket的基本工作流程,并计划在未来探讨同步与异步Socket的区别。 ... [详细]
  • 高效产品原型设计:技巧、经验和注意事项
    本文由PMTalk社区资深作者AllenDan撰写,分享了如何在日常产品工作中快速有效地设计产品原型,并确保设计易于理解,减少评审时的质疑。文章不仅提供了实用的技巧和经验,还强调了设计过程中的注意事项。 ... [详细]
  • 利用Cookie实现用户登录状态的持久化
    本文探讨了如何使用Cookie技术在Web应用中实现用户登录状态的持久化,包括Cookie的基本概念、优势及主要操作方法,并通过一个简单的Java Web项目示例展示了具体实现过程。 ... [详细]
  • 本文探讨了在SharePoint环境中使用BDC(Business Data Catalog)时遇到的问题及其解决策略,包括XML文件导入SSP后的不可见性问题以及与远程SQL Server 2005连接的难题。 ... [详细]
  • Git版本控制基础解析
    本文探讨了Git作为版本控制工具的基本概念及其重要性,不仅限于代码管理,还包括文件的历史记录与版本切换功能。通过对比Git与SVN,进一步阐述了分布式版本控制系统的独特优势。 ... [详细]
  • LoadRunner中的IP欺骗配置与实践
    为了确保服务器能够有效地区分不同的用户请求,避免多人使用同一IP地址造成的访问限制,可以通过配置IP欺骗来解决这一问题。本文将详细介绍IP欺骗的工作原理及其在LoadRunner中的具体配置步骤。 ... [详细]
  • 本文详细介绍了PHP中的几种超全局变量,包括$GLOBAL、$_SERVER、$_POST、$_GET等,并探讨了AJAX的工作原理及其优缺点。通过具体示例,帮助读者更好地理解和应用这些技术。 ... [详细]
  • 本文详细介绍了在PHP中如何获取和处理HTTP头部信息,包括通过cURL获取请求头信息、使用header函数发送响应头以及获取客户端HTTP头部的方法。同时,还探讨了PHP中$_SERVER变量的使用,以获取客户端和服务器的相关信息。 ... [详细]
  • 使用jQuery与百度地图API实现地址转经纬度功能
    本文详细介绍了如何利用jQuery和百度地图API将地址转换为经纬度,包括申请API密钥、页面构建及核心代码实现。 ... [详细]
  • 探索北京八大处富斯特滑道的魅力
    对于寻求休闲与冒险的旅行者来说,北京八大处富斯特滑道是一个不可多得的好去处。本文将详细介绍富斯特滑道的特点、如何到达以及游玩建议。 ... [详细]
author-avatar
星星看家家_160
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有