jQuery实现QQ空间图片展示效果

于 2017-01-07 16:14:40 发布
阅读量2.4k 收藏 3
点赞数 1
分类专栏： Jquery及其组件 微信 | QQ 文章标签： jquery qq空间 图片

Index.html

图片浏览支持键盘左右方向键，增强用户体验

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>QQ Photo</title>
    <link rel="stylesheet" href="css/base.css?ver=1.1.0">
    <link rel="stylesheet" href="css/style.css?ver=1.1.0">
</head>
<body> 
    <ul class="thumb-list clearfix">
        <li><a href="javascript:void(0);"><img src="http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/200/h/200" width="200" height="200" /></a></li>
        <li><a href="javascript:void(0);"><img src="http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/200/h/200" width="200" height="200" /></a></li>
        <li><a href="javascript:void(0);"><img src="http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/200/h/200" width="200" height="200" /></a></li>
        <li><a href="javascript:void(0);"><img src="http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/200/h/200" width="200" height="200" /></a></li>
        <li><a href="javascript:void(0);"><img src="http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/200/h/200" width="200" height="200" /></a></li>

    </ul>

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/QQPhoto.min.js?ver=1.1.0"></script>
    <script type="text/javascript">
        $( '.thumb-list li' ).QQPhoto({
            url : 'data.json',                 //获取相册列表数据的URL地址 需要返回 JSON 格式，请参考文件 data.json 格式来输出
            commentURL : 'api.php',            //提交评论 Ajax 发送到 服务器端的地址   返回 JSON 格式，请参考文件 comment.json 格式来输出 
            fix : 5,                           //表示相册列表左右间距的距离                 默认 5 
            minTextLen : 3,                    //发送评论时 表单验证，最少不能少于的字符    默认三个字符
            maxTextLen : 140,                  //发送评论时 表单验证，最多不能少于的字符    默认140个字符
            fadeIn : true,                     //图片默认是否开启淡入效果，默认为 false 
            lazyload: 'images/lazyload.gif',   //默认lazyload的图片，默认为1px.gif 透明图片
            loadding : 'images/loading.gif'    //loading.gif 的文件路径
        });
    </script>
</body>
</html>

data.json

{
    "code": 1,
    "album": "默认相册",
    "showimages": "20.jpg",
    "thumbList": [
        {
            "id": "1.jpg",
            "title": "图片1",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢1！",
            "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/1.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
                }
            ]
        },
        {
            "id": "2.jpg",
            "title": "图片2",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢2！",
            "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/2.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
                }
            ]
        },
        {
            "id": "3.jpg",
            "title": "图片3",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢3！",
            "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/3.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
                }
            ]
        },
        {
            "id": "4.jpg",
            "title": "图片4",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢4！",
            "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/4.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
                }
            ]
        },
        {
            "id": "5.jpg",
            "title": "图片5",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢5！",
            "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/5.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
                }
            ]
        },
        {
            "id": "6.jpg",
            "title": "图片6",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢6！",
            "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/6.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
                }
            ]
        },
        {
            "id": "7.jpg",
            "title": "图片7",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢7！",
            "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/7.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
                }
            ]
        },
        {
            "id": "8.jpg",
            "title": "图片8",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢8！",
            "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/8.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
                }
            ]
        },
        {
            "id": "9.jpg",
            "title": "图片9",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢9！",
            "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/9.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
                }
            ]
        },
        {
            "id": "10.jpg",
            "title": "图片10",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢10！",
            "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/10.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
                }
            ]
        },
        {
            "id": "11.jpg",
            "title": "图片1",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢1！",
            "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/1.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
                }
            ]
        },
        {
            "id": "12.jpg",
            "title": "图片2",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢2！",
            "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/2.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
                }
            ]
        },
        {
            "id": "13.jpg",
            "title": "图片3",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢3！",
            "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/3.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
                }
            ]
        },
        {
            "id": "14.jpg",
            "title": "图片4",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢4！",
            "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/4.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
                }
            ]
        },
        {
            "id": "15.jpg",
            "title": "图片5",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢5！",
            "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/5.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
                }
            ]
        },
        {
            "id": "16.jpg",
            "title": "图片6",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢6！",
            "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/6.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
                }
            ]
        },
        {
            "id": "17.jpg",
            "title": "图片7",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢7！",
            "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/7.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
                }
            ]
        },
        {
            "id": "18.jpg",
            "title": "图片8",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢8！",
            "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/8.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
                }
            ]
        },
        {
            "id": "19.jpg",
            "title": "图片9",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢9！",
            "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/9.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
                }
            ]
        },
        {
            "id": "20.jpg",
            "title": "图片10",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢10！",
            "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/10.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
                }
            ]
        },
        {
            "id": "21.jpg",
            "title": "图片1",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢1！",
            "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/1.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
                }
            ]
        },
        {
            "id": "22.jpg",
            "title": "图片2",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢2！",
            "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/2.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
                }
            ]
        },
        {
            "id": "23.jpg",
            "title": "图片3",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢3！",
            "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/3.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
                }
            ]
        },
        {
            "id": "24.jpg",
            "title": "图片4",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢4！",
            "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/4.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
                }
            ]
        },
        {
            "id": "25.jpg",
            "title": "图片5",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢5！",
            "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/5.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
                }
            ]
        },
        {
            "id": "26.jpg",
            "title": "图片6",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢6！",
            "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/6.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
                }
            ]
        },
        {
            "id": "27.jpg",
            "title": "图片7",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢7！",
            "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/7.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
                }
            ]
        },
        {
            "id": "28.jpg",
            "title": "图片8",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢8！",
            "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/8.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
                }
            ]
        },
        {
            "id": "29.jpg",
            "title": "图片9",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢9！",
            "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/9.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
                }
            ]
        },
        {
            "id": "30.jpg",
            "title": "图片10",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢10！",
            "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/10.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
                }
            ]
        },
        {
            "id": "31.jpg",
            "title": "图片1",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢1！",
            "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/1.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
                }
            ]
        },
        {
            "id": "32.jpg",
            "title": "图片2",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢2！",
            "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/2.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下2"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
                }
            ]
        },
        {
            "id": "33.jpg",
            "title": "图片3",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢3！",
            "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/3.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下3"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
                }
            ]
        },
        {
            "id": "34.jpg",
            "title": "图片4",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢4！",
            "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/4.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下4"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
                }
            ]
        },
        {
            "id": "35.jpg",
            "title": "图片5",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢5！",
            "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/5.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下5"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
                }
            ]
        },
        {
            "id": "36.jpg",
            "title": "图片6",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢6！",
            "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/6.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下6"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
                }
            ]
        },
        {
            "id": "37.jpg",
            "title": "图片7",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢7！",
            "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/7.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下7"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
                }
            ]
        },
        {
            "id": "38.jpg",
            "title": "图片8",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢8！",
            "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/8.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下8"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
                }
            ]
        },
        {
            "id": "39.jpg",
            "title": "图片9",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢9！",
            "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/9.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下9"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
                }
            ]
        },
        {
            "id": "40.jpg",
            "title": "图片10",
            "user": "M.J",
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "time": "2014-06-19",
            "desc": "坑爹呢10！",
            "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
            "large": "http://gitphoto.qiniudn.com/10.jpg",
            "comment": [
                {
                    "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
                    "user": "小明",
                    "msg": "怒赞32下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
                    "user": "小李",
                    "msg": "怒赞64下10"
                },
                {
                    "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
                    "user": "小小强",
                    "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
                }
            ]
        }
    ]
}

comment.json

{
    "code": 1,
    "msg": "成功或错误的提示信息",
    "comment": [
        {
            "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
            "user": "用户的名字",
            "msg": "用户的留言内容"
        }
    ]
}

api.php

<?php
if (PHP_VERSION < '5.0.0'){
    header("Content-type: text/html;charset=utf-8"); 
    exit('您的PHP版本过低本系统建议使用5.0.0以上版本'); 
}
error_reporting( 2 );

$msg = htmlspecialchars( $_POST['msg'] );
$pictureid = htmlspecialchars( $_POST['pictureid'] );

$JSON = array(
    'code' => 1,
    'msg' => '发送成功！',
    'comment' => array(
            array(
                'avatar' => 'http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G',
                'user' => 'M.J',
                'msg' => $msg
            )
        )
);

$result = json_encode( $JSON );
echo $result;
?>

运行结果如图:

这里写图片描述

这里写图片描述

这里写图片描述

.NET跨平台
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
jQuery仿QQ空间图片查看特效（全屏，放大，缩小，旋转，镜像，鼠标滚轮缩放）
uffgfbft的博客
11-02 567
分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&a
JavaScript 动态网页实例 —— 图像显示
最新发布
cccloveforever的博客
06-08 1207
图像是网页设计中必不可少的内容之一，而图像的显示方式更是关系到网站的第一印象。本章介绍图像的显示，主要包括:图片的随机显示、图像的显示和隐藏、图像的滚动显示、图像的探照灯扫描显示、多幅图像的翻页显示、图像的水纹效果显示、全景图效果显示手电照射效果显示以及雷达扫描效果显示等。在这些显示效果中，应用了很多CSS的内容读者需要对CSS和JavaScript对CSS的处理有一定了解。
jQuery实例：图片展示效果
anjichan4261的博客
07-30 139
先看Html： HTML 代码 <div id="photoShow"> <div class="photo"> <img src="p1.jpg" /> <span>张娜拉，韩国的</span> </div> <div class="photo"> <img src="p2.j...
Jquery图片查看器，jquery实现类似QQ空间相册查看效果
12-20
实现类似QQ空间的炫酷图片查看效果，代码简洁易懂。兼容性好
jQuery仿QQ空间图片查看特效（全屏，放大，缩小，旋转）
01-12
jQuery仿QQ空间图片查看特效（全屏，放大，缩小，旋转）.zip
jquery实现图片浏览类似qq空间图片查看
12-09
插件描述：利用layer.min.js插件进行实现. 参考示例：http://www.jq22.com/jquery-info5018
jQuery实现仿QQ空间装扮预览图片的鼠标提示效果代码
10-23
本篇文档介绍的是使用jQuery实现一种类似于腾讯QQ空间装扮预览功能的鼠标提示效果。通过该功能，用户在将鼠标悬停在特定图片上时，可以实现鼠标提示框的显示，从而展示图片的详细信息，如图片的标题或描述，并通过...
jQuery插件实现图片展开效果，jquery.gallery。仿腾讯QQ空间说说图片展示效果。.html
04-01
jQuery插件实现图片展开效果，jquery.gallery。仿腾讯QQ空间说说图片展示效果。
jQuery js-实现高仿朋友圈QQ空间图片相册查看效果插件.zip
07-11
本教程将详细讲解如何利用jQuery实现一个高仿朋友圈或QQ空间图片相册查看的效果，这涉及到JavaScript编程、CSS样式设计以及响应式布局等多个知识点。 首先，jQuery的核心在于它的选择器，它可以方便地选取HTML元素...
jquery 实现QQ空间查看带图说说效果
09-10
这个功能允许用户浏览带有图片的说说，提供一种视觉上吸引人的用户体验，类似于QQ空间中的图片展示方式。 首先，我们需要理解jQuery的核心概念。jQuery是一个高效、简洁的JavaScript库，它简化了HTML文档遍历、事件...
jquery 实现类似 QQ 空间相册查看效果
09-10
总的来说，通过jQuery实现类似QQ空间相册的图片查看效果，主要涉及到图片的切换动画、预加载、交互事件处理以及可能的额外功能如放大和全屏。在实际项目中，还需要考虑响应式设计以适应不同设备的屏幕尺寸。这个过程...
QQ空间图片展现效果
08-21
类似QQ空间图片展示效果，具有上一张，下一张图片切换的效果
jQuery图片缩放图片图片转动仿QQ空间图片查看特效（全屏，放大，缩小，旋转，镜像，鼠标滚轮缩放）
07-08
jQuery图片缩放图片图片转动仿QQ空间图片查看特效（全屏，放大，缩小，旋转，镜像，鼠标滚轮缩放）
jquery图片点击放大插件仿QQ空间相册
07-23
jquery插件，图片点击放大并自动播放，可上下翻动，内含说明文档用于兼容各版本jquery
JQuery做的一个简单的图片展示效果
08-07
JQuery做的一个简单的图片展示效果，稍作修改可以仿照QQ的图片展示。
jquery仿QQ空间图片查看
10-18
jquery仿QQ空间图片查看（全屏，放大，缩小，旋转），实现类似QQ空间的炫酷图片查看效果，代码简洁易懂。兼容性好
jQuery模拟QQ空间相册点开大图效果
06-10
依赖于layer.ext插件实现的一款图片点击放大效果，效果模仿QQ空间里查看相册的效果，左侧可以左右切换的图片，右侧是文字说明等评论内容 使用方法简单，依次将需要的代码部分拷贝到你的网页中即可，并保持路径正确
使用jQuery实现手风琴式图片展示效果
"这篇文章主要讲解了如何使用jQuery来实现手风琴式的图片展示效果，涉及到jQuery事件处理和CSS样式的动态改变，具有很高的实用价值。通过实例代码展示了一个基于jQuery的手风琴图片展示效果的实现过程。" 在网页...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值