CSS3实现瀑布流布局与无限加载图片相册的实例代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace 瀑布流布局与无限加载图片相册
{
    public class Photoes
    {
        public int imgUrl { get; set; }
        public string Name { get; set; }
        //模拟数据库有两百条数据
        public static List<Photoes> GetData()
        {
            List<Photoes> list = new List<Photoes>();
            Photoes pic = null;
            for (int i= 21; i <=200; i++)
            {
                pic = new Photoes();
                pic.imgUrl = i;
                pic.Name = "Picture-" + i;
                list.Add(pic);
            }
            return list;
        }
    }
}

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Script.Serialization;

namespace 瀑布流布局与无限加载图片相册
{
    /// <summary>
    /// 服务器返回数据给客户端的一般处理程序
    /// </summary>
    public class Handler1 : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            List<Photoes> result = Photoes.GetData();
            int pageIndex = Convert.ToInt32(context.Request["page"]);
            var filtered = result.Where(p => p.imgUrl >= pageIndex * 20 - 19 && p.imgUrl <= pageIndex * 20).ToList();
            JavaScriptSerializer ser = new JavaScriptSerializer();
            string jsonData = ser.Serialize(filtered);
            context.Response.Write(jsonData);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}