网络世界中的图片以及相关的处理

内容摘要

这一讲中,我讲解了网络世界中图片格式,以及他们的一些特点

  1. JPG 或者JPEG
  2. GIF
  3. PNG

同时,还通过实例讲解了三种常见的提高网页显示图片的速度的策略

  1. 根据80/20法则,先显示较小的图片,只有当真正需要的时候,才显示大图片
  2. 使用异步加载的方式,加载大图片
  3. 使用延迟加载的策略,实现更加智能化的加载方式

 

讲义地址

https://skydrive.live.com/redir.aspx?cid=bb01f26f28894a40&resid=BB01F26F28894A40!127&parid=BB01F26F28894A40!111

 

视频地址

http://www.tudou.com/programs/view/HWLDk95bBf8/

 

示例代码(异步加载图片)

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        //window.Ready

        $(function () {
            $("img").each(function () {
                $(this).attr("src", $(this).attr("originalsrc"));
            });
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <img src="placeholder.png" 
            originalsrc="DSC_0006.jpg" alt="" />
    </div>
    </form>
</body>
</html>
网络世界中的图片以及相关的处理

你可能感兴趣的:(图片)