├── README.md ├── api.php ├── comment.json ├── css ├── base.css └── style.css ├── data.json ├── images ├── arrow.png ├── arrow_8.png ├── lazyload.gif └── loading.gif ├── index.html └── js ├── QQPhoto.js ├── QQPhoto.min.js └── jquery.min.js /README.md: -------------------------------------------------------------------------------- 1 | QQPhoto 2 | ========= 3 | 4 |
5 |13 | 14 |更新说明:==== v1.1.0 ==== 2014-06-29
6 |7 |
12 |- 增加键盘左右方向键的支持,增强用户体验
8 |- 增加缩略小图图片的异步加载,默认使用1px.gif替代
9 |- 留言发送数据格式换POST发送
10 |- PS:纯属练手,相册性能有问题!!!(功底太差)
11 |
QQPhoto 是一个仿QQ空间相册显示功能插件, 依赖jQuery库
15 |Demo 预览:http://demo.webjyh.com/QQPhoto/
16 | 17 | 只是测试页面,所有数据全都重复的。留言数据也是如此,只保留当前发送的内容,关闭则全部重置。如在项目开发中,里面许多接口需要和服务端配合。 18 | 请使用PHP环境来测试,本页面采用PHP环境测试 19 | 20 | 1.图片相册功能 21 | 2.预加载上一张,下一张图片 22 | 3.留言提交。 23 | 4.兼容了 万恶的 IE6, 不过不建议使用 24 | 25 | 如何不兼容 IE6 可以找到 QQPhoto.js 文件中 以下代码
27 | this.IE6 = !-[1,]&&!window.XMLHttpRequest;
28 |
29 | 修改成如下:
30 |
31 | this.IE6 = false;
32 |
33 |
34 | 如有错误或Bug请在我博客留言说明。地址:http://webjyh.com
35 |
--------------------------------------------------------------------------------
/api.php:
--------------------------------------------------------------------------------
1 | 1,
13 | 'msg' => '发送成功!',
14 | 'comment' => array(
15 | array(
16 | 'avatar' => 'http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G',
17 | 'user' => 'M.J',
18 | 'msg' => $msg
19 | )
20 | )
21 | );
22 |
23 | $result = json_encode( $JSON );
24 | echo $result;
25 | ?>
--------------------------------------------------------------------------------
/comment.json:
--------------------------------------------------------------------------------
1 | {
2 | "code": 1,
3 | "msg": "成功或错误的提示信息",
4 | "comment": [
5 | {
6 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
7 | "user": "用户的名字",
8 | "msg": "用户的留言内容"
9 | }
10 | ]
11 | }
--------------------------------------------------------------------------------
/css/base.css:
--------------------------------------------------------------------------------
1 | html, body, div, span, applet, object, iframe,
2 | h1, h2, h3, h4, h5, h6, p, blockquote, pre,
3 | a, abbr, acronym, address, big, cite, code,
4 | del, dfn, em, img, ins, kbd, q, s, samp,
5 | small, strike, strong, sub, sup, tt, var,
6 | b, u, i, center,
7 | dl, dt, dd, ol, ul, li,
8 | fieldset, form, label, legend,
9 | table, caption, tbody, tfoot, thead, tr, th, td,
10 | article, aside, canvas, details, embed,
11 | figure, figcaption, footer, header, hgroup,
12 | menu, nav, output, ruby, section, summary,
13 | time, mark, audio, video {
14 | margin: 0;
15 | padding: 0;
16 | border: 0;
17 | font-size: 100%;
18 | font: inherit;
19 | vertical-align: baseline;
20 | }
21 | /* HTML5 display-role reset for older browsers */
22 | article, aside, details, figcaption, figure,
23 | footer, header, hgroup, menu, nav, section {
24 | display: block;
25 | }
26 | body {
27 | line-height: 1;
28 | }
29 | ol, ul {
30 | list-style: none;
31 | }
32 | blockquote, q {
33 | quotes: none;
34 | }
35 | blockquote:before, blockquote:after,
36 | q:before, q:after {
37 | content: '';
38 | content: none;
39 | }
40 | table {
41 | border-collapse: collapse;
42 | border-spacing: 0;
43 | }
44 |
45 | a { color: #333; }
46 | body { font-size: 12px; line-height: 1.6; color: #333; font-family:"Microsoft Yahei", Arial; background: #F2F2F2; }
47 | .title { padding: 15px; font-size: 16px; }
48 | .update-title { font-size: 14px; color: #666; padding: 15px; }
49 | .update-list { padding: 15px; line-height: 2.2; font-size: 13px; list-style-type: decimal; padding-left: 60px; }
50 | p { line-height: 1.8; font-size: 14px; padding-left: 15px; margin-bottom: 15px; }
51 | .thumb-list li { float: left; padding: 4px; border: 1px solid #DDD; background: #FFF; margin: 0px 10px; }
52 | .thumb-list li img { vertical-align: top; }
--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
1 | /**
2 | * QQ.Photo 1.1.0
3 | * Date: 2014-05-15
4 | * (c) 2014-2014 M.J, http://webjyh.com
5 | *
6 | * This is licensed under the GNU LGPL, version 2.1 or later.
7 | * For details, see: http://creativecommons.org/licenses/LGPL/2.1/
8 | *
9 | */
10 | /* ui-dialog-wrap */
11 | .ui-dialog-wrap {
12 | position: fixed;
13 | _position: absolute;
14 | top: 50px;
15 | _top:expression(documentElement.scrollTop + 50 + 'px');
16 | left: 100px;
17 | right: 100px;
18 | bottom: 50px;
19 | background: #000;
20 | z-index: 999;
21 | box-shadow: 0px 0px 20px rgba( 0, 0, 0, 0.5 );
22 | font-family: "Microsoft Yahei", Arial;
23 | color: #555;
24 | }
25 | .ui-dialog-wrap .ui-clearfix:after {
26 | content:'\20';
27 | display:block;
28 | height:0;
29 | clear:both;
30 | }
31 | .ui-dialog-wrap .ui-clearfix {
32 | *zoom:1;
33 | }
34 |
35 |
36 | /* ui-dialog-wrap > ui-dialog-primary */
37 | .ui-dialog-wrap .ui-dialog-primary {
38 | position: absolute;
39 | top: 0px;
40 | left: 0px;
41 | right: 300px;
42 | bottom: 0px;
43 | }
44 |
45 | /* ui-dialog-wrap > photo */
46 | .ui-dialog-wrap .ui-dialog-photo {
47 | position: absolute;
48 | top: 10px;
49 | left: 10px;
50 | right: 10px;
51 | bottom: 65px;
52 | text-align: center;
53 | font-size: 0;
54 | overflow:hidden;
55 | background: url(../images/loading.gif) no-repeat 50% 50%;
56 | }
57 |
58 | /* ui-dialog-wrap > photo > arrow */
59 | .ui-dialog-wrap .ui-dialog-photo a {
60 | outline: none;
61 | position: absolute;
62 | display: block;
63 | top: 0px;
64 | bottom: 0px;
65 | cursor: pointer;
66 | height: 100%;
67 | z-index :10;
68 | }
69 |
70 | .ui-dialog-wrap .ui-dialog-photo a em,
71 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbLeft span,
72 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbRight span,
73 | .ui-dialog-wrap .ui-dialog-close a {
74 | background: url(../images/arrow.png) no-repeat -999px -999px;
75 | _background: url(../images/arrow_8.png) no-repeat -999px -999px;
76 | }
77 |
78 | .ui-dialog-wrap .ui-dialog-photo a em {
79 | position: absolute;
80 | display: block;
81 | width: 27px;
82 | height: 44px;
83 | top: 45%;
84 | }
85 | .ui-dialog-wrap .ui-dialog-photo a.ui-dialog-arrowLeft {
86 | left: 0px;
87 | right: 50%;
88 | }
89 |
90 | .ui-dialog-wrap .ui-dialog-photo a.ui-dialog-arrowRight {
91 | left: 50%;
92 | right: 0px;
93 | }
94 |
95 | .ui-dialog-wrap .ui-dialog-photo a.ui-dialog-arrowLeft em {
96 | left: 20px;
97 | background-position: 0px -34px;
98 | }
99 |
100 | .ui-dialog-wrap .ui-dialog-photo a.ui-dialog-arrowRight em {
101 | right: 20px;
102 | background-position: -0px -79px;
103 | }
104 |
105 | .ui-dialog-wrap .ui-dialog-photo a:hover.ui-dialog-arrowLeft em {
106 | background-position: -28px -34px;
107 | }
108 |
109 | .ui-dialog-wrap .ui-dialog-photo a:hover.ui-dialog-arrowRight em {
110 | background-position: -28px -79px;
111 | }
112 |
113 | /* ui-dialog-wrap > photo > img */
114 | .ui-dialog-wrap .ui-dialog-photo span {
115 | display: inline-block;
116 | zoom : 1;
117 | width: 0px;
118 | height: 100%;
119 | overflow: hidden;
120 | margin-left: -1px;
121 | font-size: 0;
122 | line-height: 0;
123 | vertical-align: middle;
124 | }
125 | .ui-dialog-wrap .ui-dialog-photo .ui-dialog-img {
126 | display:none;
127 | vertical-align: middle;
128 | max-width: 100%;
129 | max-height: 100%;
130 | }
131 |
132 | /* ui-dialog-album */
133 | .ui-dialog-wrap .ui-dialog-photo .ui-dialog-album {
134 | position: absolute;
135 | bottom: 0px;
136 | left: 0px;
137 | height: 30px;
138 | width: 100%;
139 | color: #FFF;
140 | z-index: 12;
141 | line-height: 30px;
142 | font-family: "Microsoft Yahei";
143 | text-align: left;
144 | font-size:12px;
145 | background: #000;
146 | background: rgba( 0, 0, 0, 0.5 );
147 | filter:Alpha( opacity=60 );
148 | overflow:hidden;
149 | }
150 |
151 | .ui-dialog-wrap .ui-dialog-photo .ui-dialog-album em {
152 | float: right;
153 | padding-right: 15px;
154 | }
155 |
156 | .ui-dialog-wrap .ui-dialog-photo .ui-dialog-title {
157 | padding-left: 15px;
158 | }
159 |
160 | /* ui-dialog-wrap > thumb-list */
161 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list {
162 | position: absolute;
163 | padding-top: 5px;
164 | height: 50px;
165 | left: 0px;
166 | right: 0px;
167 | bottom: 5px;
168 | overflow:hidden;
169 | }
170 |
171 | /* ui-dialog-wrap > thumb-arrow */
172 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbLeft,
173 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbRight {
174 | position: absolute;
175 | top: 5px;
176 | left: 5px;
177 | display: block;
178 | width: 25px;
179 | height: 100%;
180 | }
181 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbRight {
182 | left: auto;
183 | right: 5px;
184 | }
185 |
186 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbLeft span,
187 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbRight span {
188 | position: absolute;
189 | display: block;
190 | width: 13px;
191 | height: 26px;
192 | top: 50%;
193 | left: 50%;
194 | margin: -13px 0px 0px -6px;
195 | }
196 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbLeft span {
197 | background-position: -1px -124px;
198 | }
199 | .ui-dialog-wrap .ui-dialog-list .ui-dialog-thumbRight span {
200 | background-position: -14px -124px;
201 | }
202 |
203 | /* ui-dialog-wrap > thumb-list > ul */
204 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list div {
205 | position: absolute;
206 | left: 30px;
207 | right: 30px;
208 | top: 5px;
209 | overflow:hidden;
210 | }
211 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li {
212 | float: left;
213 | display: inline;
214 | width: 50px;
215 | height: 50px;
216 | overflow: hidden;
217 | margin-left: 5px;
218 | }
219 |
220 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a {
221 | position: relative;
222 | display: block;
223 | width: 50px;
224 | height: 50px;
225 | filter: Alpha(Opacity=60);
226 | opacity: 0.6;
227 | background: url(../images/loading.gif) no-repeat 50% 50%;
228 | -webkit-transition: opacity 0.4s ease;
229 | -moz-transition: opacity 0.4s ease;
230 | -ms-transition: opacity 0.4s ease;
231 | -o-transition: opacity 0.4s ease;
232 | transition: opacity 0.4s ease;
233 | }
234 |
235 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a:hover,
236 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a.current {
237 | opacity: 1;
238 | filter: Alpha(Opacity=100);
239 | }
240 |
241 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a.current,
242 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a.current img {
243 | width: 40px;
244 | height: 40px;
245 |
246 | }
247 | .ui-dialog-wrap .ui-dialog-primary .ui-dialog-list li a.current {
248 | border: 5px solid #73B4E0;
249 | }
250 |
251 | /* ui-dialog-wrap > ui-dialog-sidebar */
252 | .ui-dialog-wrap .ui-dialog-sidebar {
253 | position: absolute;
254 | right: 0px;
255 | top: 0px;
256 | bottom: 0px;
257 | width: 300px;
258 | background: #FFF;
259 | overflow-y: auto;
260 | overflow-x: hidden;
261 | }
262 |
263 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-info,
264 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-form {
265 | padding: 15px 10px;
266 | border-bottom: 1px solid #DDD;
267 | }
268 |
269 | /* ui-dialog-wrap > sidebar > avatar */
270 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-avatar {
271 | float: left;
272 | width: 50px;
273 | height: 50px;
274 | overflow: hidden;
275 | }
276 |
277 | /* ui-dialog-wrap > sidebar > userInfo */
278 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-details {
279 | padding-left: 60px;
280 | padding-top: 10px;
281 | height: 50px;
282 | }
283 |
284 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-userName {
285 | font-size: 14px;
286 | line-height: 180%;
287 | }
288 |
289 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-time {
290 | font-size: 12px;
291 | padding-top: 2px;
292 | color: #999;
293 | }
294 |
295 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-description {
296 | font-size: 13px;
297 | line-height: 160%;
298 | }
299 |
300 | /* ui-dialog-wrap > sidebar > msg */
301 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-msg {
302 | width: 90%;
303 | display: block;
304 | min-height: 60px;
305 | margin: 0px auto 10px;
306 | border-radius: 5px;
307 | outline: none;
308 | border: 1px solid #CCC;
309 | padding: 5px;
310 | font-family: "Microsoft Yahei";
311 | -webkit-transition: all 0.3s;
312 | -moz-transition: all 0.3s;
313 | -ms-transition: all 0.3s;
314 | -o-transition: all 0.3s;
315 | transition: all 0.3s;
316 | }
317 |
318 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-msg:focus {
319 | border-color: #2e8ded;
320 | box-shadow: 0px 0px 10px rgba( 46, 141, 237, 0.3 );
321 | }
322 |
323 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-msgInfo {
324 | display: none;
325 | color: #52b2dc;
326 | width: 90%;
327 | font-size: 12px;
328 | line-height: 160%;
329 | margin: 0px auto 10px;
330 | }
331 |
332 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-msgInfo.error {
333 | color: red;
334 | }
335 |
336 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit {
337 | display: block;
338 | border: none;
339 | height: 30px;
340 | cursor: pointer;
341 | width: 90%;
342 | text-align: center;
343 | color: #FFF;
344 | margin:0px auto;
345 | border-radius: 5px;
346 | line-height: 30px;
347 | background: #00B33C;
348 | font-weight: bold;
349 | }
350 |
351 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit.disabled {
352 | color: #999;
353 | cursor: no-drop;
354 | background: #E0E0E0;
355 | }
356 |
357 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit:hover {
358 | background: #009933;
359 | }
360 |
361 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit.disabled {
362 | color: #999;
363 | cursor: no-drop;
364 | background: #E0E0E0;
365 | }
366 |
367 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit.disabled:hover,
368 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-submit:hover {
369 | -webkit-box-shadow: inset 0 0px 20px rgba( 0, 0, 0, 0.3 );
370 | -moz-box-shadow: inset 0 0px 20px rgba( 0, 0, 0, 0.3 );
371 | box-shadow: inset 0 0px 20px rgba( 0, 0, 0, 0.3 );
372 | }
373 |
374 | /* ui-dialog-wrap > sidebar > commentlist */
375 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-commentlist {
376 | }
377 |
378 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-commentlist .thumb {
379 | float: left;
380 | width: 30px;
381 | height: 30px;
382 | background: url(../images/loading.gif) no-repeat 50% 50%;
383 | margin-top: 8px;
384 | margin-left: 10px;
385 | }
386 |
387 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-commentlist .comment-body {
388 | font-size: 12px;
389 | padding: 8px 10px 8px 50px;
390 | border-bottom: 1px solid #EFEFEF;
391 | *margin-top: -15px;
392 | }
393 |
394 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-commentlist .user-name {
395 | font-weight: bold;
396 | padding-bottom: 5px;
397 | }
398 |
399 | .ui-dialog-wrap .ui-dialog-sidebar .ui-dialog-commentlist .user-text {
400 | line-height: 140%;
401 | color: #888;
402 | }
403 |
404 | /* ui-dialog-wrap > ui-dialog-close */
405 | .ui-dialog-wrap .ui-dialog-close {
406 | position: absolute;
407 | width: 30px;
408 | height: 30px;
409 | right: -15px;
410 | top: -15px;
411 | }
412 |
413 | .ui-dialog-wrap .ui-dialog-close a {
414 | display: block;
415 | width: 100%;
416 | height: 100%;
417 | background-position:0px 0px;
418 | }
419 |
420 | .ui-dialog-wrap .ui-dialog-close a:hover {
421 | background-position: -31px 0px;
422 | }
--------------------------------------------------------------------------------
/data.json:
--------------------------------------------------------------------------------
1 | {
2 | "code": 1,
3 | "album": "默认相册",
4 | "showimages": "20.jpg",
5 | "thumbList": [
6 | {
7 | "id": "1.jpg",
8 | "title": "图片1",
9 | "user": "M.J",
10 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
11 | "time": "2014-06-19",
12 | "desc": "坑爹呢1!",
13 | "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
14 | "large": "http://gitphoto.qiniudn.com/1.jpg",
15 | "comment": [
16 | {
17 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
18 | "user": "小明",
19 | "msg": "怒赞32下"
20 | },
21 | {
22 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
23 | "user": "小李",
24 | "msg": "怒赞64下"
25 | },
26 | {
27 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
28 | "user": "小小强",
29 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
30 | }
31 | ]
32 | },
33 | {
34 | "id": "2.jpg",
35 | "title": "图片2",
36 | "user": "M.J",
37 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
38 | "time": "2014-06-19",
39 | "desc": "坑爹呢2!",
40 | "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
41 | "large": "http://gitphoto.qiniudn.com/2.jpg",
42 | "comment": [
43 | {
44 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
45 | "user": "小明",
46 | "msg": "怒赞32下2"
47 | },
48 | {
49 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
50 | "user": "小李",
51 | "msg": "怒赞64下2"
52 | },
53 | {
54 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
55 | "user": "小小强",
56 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
57 | }
58 | ]
59 | },
60 | {
61 | "id": "3.jpg",
62 | "title": "图片3",
63 | "user": "M.J",
64 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
65 | "time": "2014-06-19",
66 | "desc": "坑爹呢3!",
67 | "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
68 | "large": "http://gitphoto.qiniudn.com/3.jpg",
69 | "comment": [
70 | {
71 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
72 | "user": "小明",
73 | "msg": "怒赞32下3"
74 | },
75 | {
76 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
77 | "user": "小李",
78 | "msg": "怒赞64下3"
79 | },
80 | {
81 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
82 | "user": "小小强",
83 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
84 | }
85 | ]
86 | },
87 | {
88 | "id": "4.jpg",
89 | "title": "图片4",
90 | "user": "M.J",
91 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
92 | "time": "2014-06-19",
93 | "desc": "坑爹呢4!",
94 | "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
95 | "large": "http://gitphoto.qiniudn.com/4.jpg",
96 | "comment": [
97 | {
98 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
99 | "user": "小明",
100 | "msg": "怒赞32下4"
101 | },
102 | {
103 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
104 | "user": "小李",
105 | "msg": "怒赞64下4"
106 | },
107 | {
108 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
109 | "user": "小小强",
110 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
111 | }
112 | ]
113 | },
114 | {
115 | "id": "5.jpg",
116 | "title": "图片5",
117 | "user": "M.J",
118 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
119 | "time": "2014-06-19",
120 | "desc": "坑爹呢5!",
121 | "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
122 | "large": "http://gitphoto.qiniudn.com/5.jpg",
123 | "comment": [
124 | {
125 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
126 | "user": "小明",
127 | "msg": "怒赞32下5"
128 | },
129 | {
130 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
131 | "user": "小李",
132 | "msg": "怒赞64下5"
133 | },
134 | {
135 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
136 | "user": "小小强",
137 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
138 | }
139 | ]
140 | },
141 | {
142 | "id": "6.jpg",
143 | "title": "图片6",
144 | "user": "M.J",
145 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
146 | "time": "2014-06-19",
147 | "desc": "坑爹呢6!",
148 | "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
149 | "large": "http://gitphoto.qiniudn.com/6.jpg",
150 | "comment": [
151 | {
152 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
153 | "user": "小明",
154 | "msg": "怒赞32下6"
155 | },
156 | {
157 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
158 | "user": "小李",
159 | "msg": "怒赞64下6"
160 | },
161 | {
162 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
163 | "user": "小小强",
164 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
165 | }
166 | ]
167 | },
168 | {
169 | "id": "7.jpg",
170 | "title": "图片7",
171 | "user": "M.J",
172 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
173 | "time": "2014-06-19",
174 | "desc": "坑爹呢7!",
175 | "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
176 | "large": "http://gitphoto.qiniudn.com/7.jpg",
177 | "comment": [
178 | {
179 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
180 | "user": "小明",
181 | "msg": "怒赞32下7"
182 | },
183 | {
184 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
185 | "user": "小李",
186 | "msg": "怒赞64下7"
187 | },
188 | {
189 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
190 | "user": "小小强",
191 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
192 | }
193 | ]
194 | },
195 | {
196 | "id": "8.jpg",
197 | "title": "图片8",
198 | "user": "M.J",
199 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
200 | "time": "2014-06-19",
201 | "desc": "坑爹呢8!",
202 | "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
203 | "large": "http://gitphoto.qiniudn.com/8.jpg",
204 | "comment": [
205 | {
206 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
207 | "user": "小明",
208 | "msg": "怒赞32下8"
209 | },
210 | {
211 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
212 | "user": "小李",
213 | "msg": "怒赞64下8"
214 | },
215 | {
216 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
217 | "user": "小小强",
218 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
219 | }
220 | ]
221 | },
222 | {
223 | "id": "9.jpg",
224 | "title": "图片9",
225 | "user": "M.J",
226 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
227 | "time": "2014-06-19",
228 | "desc": "坑爹呢9!",
229 | "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
230 | "large": "http://gitphoto.qiniudn.com/9.jpg",
231 | "comment": [
232 | {
233 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
234 | "user": "小明",
235 | "msg": "怒赞32下9"
236 | },
237 | {
238 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
239 | "user": "小李",
240 | "msg": "怒赞64下9"
241 | },
242 | {
243 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
244 | "user": "小小强",
245 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
246 | }
247 | ]
248 | },
249 | {
250 | "id": "10.jpg",
251 | "title": "图片10",
252 | "user": "M.J",
253 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
254 | "time": "2014-06-19",
255 | "desc": "坑爹呢10!",
256 | "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
257 | "large": "http://gitphoto.qiniudn.com/10.jpg",
258 | "comment": [
259 | {
260 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
261 | "user": "小明",
262 | "msg": "怒赞32下10"
263 | },
264 | {
265 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
266 | "user": "小李",
267 | "msg": "怒赞64下10"
268 | },
269 | {
270 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
271 | "user": "小小强",
272 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
273 | }
274 | ]
275 | },
276 | {
277 | "id": "11.jpg",
278 | "title": "图片1",
279 | "user": "M.J",
280 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
281 | "time": "2014-06-19",
282 | "desc": "坑爹呢1!",
283 | "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
284 | "large": "http://gitphoto.qiniudn.com/1.jpg",
285 | "comment": [
286 | {
287 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
288 | "user": "小明",
289 | "msg": "怒赞32下"
290 | },
291 | {
292 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
293 | "user": "小李",
294 | "msg": "怒赞64下"
295 | },
296 | {
297 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
298 | "user": "小小强",
299 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
300 | }
301 | ]
302 | },
303 | {
304 | "id": "12.jpg",
305 | "title": "图片2",
306 | "user": "M.J",
307 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
308 | "time": "2014-06-19",
309 | "desc": "坑爹呢2!",
310 | "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
311 | "large": "http://gitphoto.qiniudn.com/2.jpg",
312 | "comment": [
313 | {
314 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
315 | "user": "小明",
316 | "msg": "怒赞32下2"
317 | },
318 | {
319 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
320 | "user": "小李",
321 | "msg": "怒赞64下2"
322 | },
323 | {
324 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
325 | "user": "小小强",
326 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
327 | }
328 | ]
329 | },
330 | {
331 | "id": "13.jpg",
332 | "title": "图片3",
333 | "user": "M.J",
334 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
335 | "time": "2014-06-19",
336 | "desc": "坑爹呢3!",
337 | "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
338 | "large": "http://gitphoto.qiniudn.com/3.jpg",
339 | "comment": [
340 | {
341 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
342 | "user": "小明",
343 | "msg": "怒赞32下3"
344 | },
345 | {
346 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
347 | "user": "小李",
348 | "msg": "怒赞64下3"
349 | },
350 | {
351 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
352 | "user": "小小强",
353 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
354 | }
355 | ]
356 | },
357 | {
358 | "id": "14.jpg",
359 | "title": "图片4",
360 | "user": "M.J",
361 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
362 | "time": "2014-06-19",
363 | "desc": "坑爹呢4!",
364 | "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
365 | "large": "http://gitphoto.qiniudn.com/4.jpg",
366 | "comment": [
367 | {
368 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
369 | "user": "小明",
370 | "msg": "怒赞32下4"
371 | },
372 | {
373 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
374 | "user": "小李",
375 | "msg": "怒赞64下4"
376 | },
377 | {
378 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
379 | "user": "小小强",
380 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
381 | }
382 | ]
383 | },
384 | {
385 | "id": "15.jpg",
386 | "title": "图片5",
387 | "user": "M.J",
388 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
389 | "time": "2014-06-19",
390 | "desc": "坑爹呢5!",
391 | "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
392 | "large": "http://gitphoto.qiniudn.com/5.jpg",
393 | "comment": [
394 | {
395 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
396 | "user": "小明",
397 | "msg": "怒赞32下5"
398 | },
399 | {
400 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
401 | "user": "小李",
402 | "msg": "怒赞64下5"
403 | },
404 | {
405 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
406 | "user": "小小强",
407 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
408 | }
409 | ]
410 | },
411 | {
412 | "id": "16.jpg",
413 | "title": "图片6",
414 | "user": "M.J",
415 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
416 | "time": "2014-06-19",
417 | "desc": "坑爹呢6!",
418 | "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
419 | "large": "http://gitphoto.qiniudn.com/6.jpg",
420 | "comment": [
421 | {
422 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
423 | "user": "小明",
424 | "msg": "怒赞32下6"
425 | },
426 | {
427 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
428 | "user": "小李",
429 | "msg": "怒赞64下6"
430 | },
431 | {
432 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
433 | "user": "小小强",
434 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
435 | }
436 | ]
437 | },
438 | {
439 | "id": "17.jpg",
440 | "title": "图片7",
441 | "user": "M.J",
442 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
443 | "time": "2014-06-19",
444 | "desc": "坑爹呢7!",
445 | "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
446 | "large": "http://gitphoto.qiniudn.com/7.jpg",
447 | "comment": [
448 | {
449 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
450 | "user": "小明",
451 | "msg": "怒赞32下7"
452 | },
453 | {
454 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
455 | "user": "小李",
456 | "msg": "怒赞64下7"
457 | },
458 | {
459 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
460 | "user": "小小强",
461 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
462 | }
463 | ]
464 | },
465 | {
466 | "id": "18.jpg",
467 | "title": "图片8",
468 | "user": "M.J",
469 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
470 | "time": "2014-06-19",
471 | "desc": "坑爹呢8!",
472 | "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
473 | "large": "http://gitphoto.qiniudn.com/8.jpg",
474 | "comment": [
475 | {
476 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
477 | "user": "小明",
478 | "msg": "怒赞32下8"
479 | },
480 | {
481 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
482 | "user": "小李",
483 | "msg": "怒赞64下8"
484 | },
485 | {
486 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
487 | "user": "小小强",
488 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
489 | }
490 | ]
491 | },
492 | {
493 | "id": "19.jpg",
494 | "title": "图片9",
495 | "user": "M.J",
496 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
497 | "time": "2014-06-19",
498 | "desc": "坑爹呢9!",
499 | "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
500 | "large": "http://gitphoto.qiniudn.com/9.jpg",
501 | "comment": [
502 | {
503 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
504 | "user": "小明",
505 | "msg": "怒赞32下9"
506 | },
507 | {
508 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
509 | "user": "小李",
510 | "msg": "怒赞64下9"
511 | },
512 | {
513 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
514 | "user": "小小强",
515 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
516 | }
517 | ]
518 | },
519 | {
520 | "id": "20.jpg",
521 | "title": "图片10",
522 | "user": "M.J",
523 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
524 | "time": "2014-06-19",
525 | "desc": "坑爹呢10!",
526 | "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
527 | "large": "http://gitphoto.qiniudn.com/10.jpg",
528 | "comment": [
529 | {
530 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
531 | "user": "小明",
532 | "msg": "怒赞32下10"
533 | },
534 | {
535 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
536 | "user": "小李",
537 | "msg": "怒赞64下10"
538 | },
539 | {
540 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
541 | "user": "小小强",
542 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
543 | }
544 | ]
545 | },
546 | {
547 | "id": "21.jpg",
548 | "title": "图片1",
549 | "user": "M.J",
550 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
551 | "time": "2014-06-19",
552 | "desc": "坑爹呢1!",
553 | "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
554 | "large": "http://gitphoto.qiniudn.com/1.jpg",
555 | "comment": [
556 | {
557 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
558 | "user": "小明",
559 | "msg": "怒赞32下"
560 | },
561 | {
562 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
563 | "user": "小李",
564 | "msg": "怒赞64下"
565 | },
566 | {
567 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
568 | "user": "小小强",
569 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
570 | }
571 | ]
572 | },
573 | {
574 | "id": "22.jpg",
575 | "title": "图片2",
576 | "user": "M.J",
577 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
578 | "time": "2014-06-19",
579 | "desc": "坑爹呢2!",
580 | "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
581 | "large": "http://gitphoto.qiniudn.com/2.jpg",
582 | "comment": [
583 | {
584 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
585 | "user": "小明",
586 | "msg": "怒赞32下2"
587 | },
588 | {
589 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
590 | "user": "小李",
591 | "msg": "怒赞64下2"
592 | },
593 | {
594 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
595 | "user": "小小强",
596 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
597 | }
598 | ]
599 | },
600 | {
601 | "id": "23.jpg",
602 | "title": "图片3",
603 | "user": "M.J",
604 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
605 | "time": "2014-06-19",
606 | "desc": "坑爹呢3!",
607 | "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
608 | "large": "http://gitphoto.qiniudn.com/3.jpg",
609 | "comment": [
610 | {
611 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
612 | "user": "小明",
613 | "msg": "怒赞32下3"
614 | },
615 | {
616 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
617 | "user": "小李",
618 | "msg": "怒赞64下3"
619 | },
620 | {
621 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
622 | "user": "小小强",
623 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
624 | }
625 | ]
626 | },
627 | {
628 | "id": "24.jpg",
629 | "title": "图片4",
630 | "user": "M.J",
631 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
632 | "time": "2014-06-19",
633 | "desc": "坑爹呢4!",
634 | "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
635 | "large": "http://gitphoto.qiniudn.com/4.jpg",
636 | "comment": [
637 | {
638 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
639 | "user": "小明",
640 | "msg": "怒赞32下4"
641 | },
642 | {
643 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
644 | "user": "小李",
645 | "msg": "怒赞64下4"
646 | },
647 | {
648 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
649 | "user": "小小强",
650 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
651 | }
652 | ]
653 | },
654 | {
655 | "id": "25.jpg",
656 | "title": "图片5",
657 | "user": "M.J",
658 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
659 | "time": "2014-06-19",
660 | "desc": "坑爹呢5!",
661 | "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
662 | "large": "http://gitphoto.qiniudn.com/5.jpg",
663 | "comment": [
664 | {
665 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
666 | "user": "小明",
667 | "msg": "怒赞32下5"
668 | },
669 | {
670 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
671 | "user": "小李",
672 | "msg": "怒赞64下5"
673 | },
674 | {
675 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
676 | "user": "小小强",
677 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
678 | }
679 | ]
680 | },
681 | {
682 | "id": "26.jpg",
683 | "title": "图片6",
684 | "user": "M.J",
685 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
686 | "time": "2014-06-19",
687 | "desc": "坑爹呢6!",
688 | "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
689 | "large": "http://gitphoto.qiniudn.com/6.jpg",
690 | "comment": [
691 | {
692 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
693 | "user": "小明",
694 | "msg": "怒赞32下6"
695 | },
696 | {
697 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
698 | "user": "小李",
699 | "msg": "怒赞64下6"
700 | },
701 | {
702 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
703 | "user": "小小强",
704 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
705 | }
706 | ]
707 | },
708 | {
709 | "id": "27.jpg",
710 | "title": "图片7",
711 | "user": "M.J",
712 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
713 | "time": "2014-06-19",
714 | "desc": "坑爹呢7!",
715 | "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
716 | "large": "http://gitphoto.qiniudn.com/7.jpg",
717 | "comment": [
718 | {
719 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
720 | "user": "小明",
721 | "msg": "怒赞32下7"
722 | },
723 | {
724 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
725 | "user": "小李",
726 | "msg": "怒赞64下7"
727 | },
728 | {
729 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
730 | "user": "小小强",
731 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
732 | }
733 | ]
734 | },
735 | {
736 | "id": "28.jpg",
737 | "title": "图片8",
738 | "user": "M.J",
739 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
740 | "time": "2014-06-19",
741 | "desc": "坑爹呢8!",
742 | "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
743 | "large": "http://gitphoto.qiniudn.com/8.jpg",
744 | "comment": [
745 | {
746 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
747 | "user": "小明",
748 | "msg": "怒赞32下8"
749 | },
750 | {
751 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
752 | "user": "小李",
753 | "msg": "怒赞64下8"
754 | },
755 | {
756 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
757 | "user": "小小强",
758 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
759 | }
760 | ]
761 | },
762 | {
763 | "id": "29.jpg",
764 | "title": "图片9",
765 | "user": "M.J",
766 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
767 | "time": "2014-06-19",
768 | "desc": "坑爹呢9!",
769 | "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
770 | "large": "http://gitphoto.qiniudn.com/9.jpg",
771 | "comment": [
772 | {
773 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
774 | "user": "小明",
775 | "msg": "怒赞32下9"
776 | },
777 | {
778 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
779 | "user": "小李",
780 | "msg": "怒赞64下9"
781 | },
782 | {
783 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
784 | "user": "小小强",
785 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
786 | }
787 | ]
788 | },
789 | {
790 | "id": "30.jpg",
791 | "title": "图片10",
792 | "user": "M.J",
793 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
794 | "time": "2014-06-19",
795 | "desc": "坑爹呢10!",
796 | "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
797 | "large": "http://gitphoto.qiniudn.com/10.jpg",
798 | "comment": [
799 | {
800 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
801 | "user": "小明",
802 | "msg": "怒赞32下10"
803 | },
804 | {
805 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
806 | "user": "小李",
807 | "msg": "怒赞64下10"
808 | },
809 | {
810 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
811 | "user": "小小强",
812 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
813 | }
814 | ]
815 | },
816 | {
817 | "id": "31.jpg",
818 | "title": "图片1",
819 | "user": "M.J",
820 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
821 | "time": "2014-06-19",
822 | "desc": "坑爹呢1!",
823 | "thumb": "http://gitphoto.qiniudn.com/1.jpg?imageView/1/w/50/h/50",
824 | "large": "http://gitphoto.qiniudn.com/1.jpg",
825 | "comment": [
826 | {
827 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
828 | "user": "小明",
829 | "msg": "怒赞32下"
830 | },
831 | {
832 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
833 | "user": "小李",
834 | "msg": "怒赞64下"
835 | },
836 | {
837 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
838 | "user": "小小强",
839 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下"
840 | }
841 | ]
842 | },
843 | {
844 | "id": "32.jpg",
845 | "title": "图片2",
846 | "user": "M.J",
847 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
848 | "time": "2014-06-19",
849 | "desc": "坑爹呢2!",
850 | "thumb": "http://gitphoto.qiniudn.com/2.jpg?imageView/1/w/50/h/50",
851 | "large": "http://gitphoto.qiniudn.com/2.jpg",
852 | "comment": [
853 | {
854 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
855 | "user": "小明",
856 | "msg": "怒赞32下2"
857 | },
858 | {
859 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
860 | "user": "小李",
861 | "msg": "怒赞64下2"
862 | },
863 | {
864 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
865 | "user": "小小强",
866 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下2"
867 | }
868 | ]
869 | },
870 | {
871 | "id": "33.jpg",
872 | "title": "图片3",
873 | "user": "M.J",
874 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
875 | "time": "2014-06-19",
876 | "desc": "坑爹呢3!",
877 | "thumb": "http://gitphoto.qiniudn.com/3.jpg?imageView/1/w/50/h/50",
878 | "large": "http://gitphoto.qiniudn.com/3.jpg",
879 | "comment": [
880 | {
881 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
882 | "user": "小明",
883 | "msg": "怒赞32下3"
884 | },
885 | {
886 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
887 | "user": "小李",
888 | "msg": "怒赞64下3"
889 | },
890 | {
891 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
892 | "user": "小小强",
893 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下3"
894 | }
895 | ]
896 | },
897 | {
898 | "id": "34.jpg",
899 | "title": "图片4",
900 | "user": "M.J",
901 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
902 | "time": "2014-06-19",
903 | "desc": "坑爹呢4!",
904 | "thumb": "http://gitphoto.qiniudn.com/4.jpg?imageView/1/w/50/h/50",
905 | "large": "http://gitphoto.qiniudn.com/4.jpg",
906 | "comment": [
907 | {
908 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
909 | "user": "小明",
910 | "msg": "怒赞32下4"
911 | },
912 | {
913 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
914 | "user": "小李",
915 | "msg": "怒赞64下4"
916 | },
917 | {
918 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
919 | "user": "小小强",
920 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下4"
921 | }
922 | ]
923 | },
924 | {
925 | "id": "35.jpg",
926 | "title": "图片5",
927 | "user": "M.J",
928 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
929 | "time": "2014-06-19",
930 | "desc": "坑爹呢5!",
931 | "thumb": "http://gitphoto.qiniudn.com/5.jpg?imageView/1/w/50/h/50",
932 | "large": "http://gitphoto.qiniudn.com/5.jpg",
933 | "comment": [
934 | {
935 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
936 | "user": "小明",
937 | "msg": "怒赞32下5"
938 | },
939 | {
940 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
941 | "user": "小李",
942 | "msg": "怒赞64下5"
943 | },
944 | {
945 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
946 | "user": "小小强",
947 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下5"
948 | }
949 | ]
950 | },
951 | {
952 | "id": "36.jpg",
953 | "title": "图片6",
954 | "user": "M.J",
955 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
956 | "time": "2014-06-19",
957 | "desc": "坑爹呢6!",
958 | "thumb": "http://gitphoto.qiniudn.com/6.jpg?imageView/1/w/50/h/50",
959 | "large": "http://gitphoto.qiniudn.com/6.jpg",
960 | "comment": [
961 | {
962 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
963 | "user": "小明",
964 | "msg": "怒赞32下6"
965 | },
966 | {
967 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
968 | "user": "小李",
969 | "msg": "怒赞64下6"
970 | },
971 | {
972 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
973 | "user": "小小强",
974 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下6"
975 | }
976 | ]
977 | },
978 | {
979 | "id": "37.jpg",
980 | "title": "图片7",
981 | "user": "M.J",
982 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
983 | "time": "2014-06-19",
984 | "desc": "坑爹呢7!",
985 | "thumb": "http://gitphoto.qiniudn.com/7.jpg?imageView/1/w/50/h/50",
986 | "large": "http://gitphoto.qiniudn.com/7.jpg",
987 | "comment": [
988 | {
989 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
990 | "user": "小明",
991 | "msg": "怒赞32下7"
992 | },
993 | {
994 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
995 | "user": "小李",
996 | "msg": "怒赞64下7"
997 | },
998 | {
999 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
1000 | "user": "小小强",
1001 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下7"
1002 | }
1003 | ]
1004 | },
1005 | {
1006 | "id": "38.jpg",
1007 | "title": "图片8",
1008 | "user": "M.J",
1009 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
1010 | "time": "2014-06-19",
1011 | "desc": "坑爹呢8!",
1012 | "thumb": "http://gitphoto.qiniudn.com/8.jpg?imageView/1/w/50/h/50",
1013 | "large": "http://gitphoto.qiniudn.com/8.jpg",
1014 | "comment": [
1015 | {
1016 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
1017 | "user": "小明",
1018 | "msg": "怒赞32下8"
1019 | },
1020 | {
1021 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
1022 | "user": "小李",
1023 | "msg": "怒赞64下8"
1024 | },
1025 | {
1026 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
1027 | "user": "小小强",
1028 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下8"
1029 | }
1030 | ]
1031 | },
1032 | {
1033 | "id": "39.jpg",
1034 | "title": "图片9",
1035 | "user": "M.J",
1036 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
1037 | "time": "2014-06-19",
1038 | "desc": "坑爹呢9!",
1039 | "thumb": "http://gitphoto.qiniudn.com/9.jpg?imageView/1/w/50/h/50",
1040 | "large": "http://gitphoto.qiniudn.com/9.jpg",
1041 | "comment": [
1042 | {
1043 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
1044 | "user": "小明",
1045 | "msg": "怒赞32下9"
1046 | },
1047 | {
1048 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
1049 | "user": "小李",
1050 | "msg": "怒赞64下9"
1051 | },
1052 | {
1053 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
1054 | "user": "小小强",
1055 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下9"
1056 | }
1057 | ]
1058 | },
1059 | {
1060 | "id": "40.jpg",
1061 | "title": "图片10",
1062 | "user": "M.J",
1063 | "avatar": "http://0.gravatar.com/avatar/8a97a5bce9686c612fce48e1070a7b71?s=35&d=&r=G",
1064 | "time": "2014-06-19",
1065 | "desc": "坑爹呢10!",
1066 | "thumb": "http://gitphoto.qiniudn.com/10.jpg?imageView/1/w/50/h/50",
1067 | "large": "http://gitphoto.qiniudn.com/10.jpg",
1068 | "comment": [
1069 | {
1070 | "avatar": "http://0.gravatar.com/avatar/cbbe656c7bb46772f589c9b18a7c747e?s=35&d=&r=G",
1071 | "user": "小明",
1072 | "msg": "怒赞32下10"
1073 | },
1074 | {
1075 | "avatar": "http://0.gravatar.com/avatar/aa4393ddcb6d10984f53361d5e92694b?s=35&d=&r=G",
1076 | "user": "小李",
1077 | "msg": "怒赞64下10"
1078 | },
1079 | {
1080 | "avatar": "http://0.gravatar.com/avatar/8c8d9931e5d1ba7537982f65fea8d805?s=35&d=&r=G",
1081 | "user": "小小强",
1082 | "msg": "怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞怒赞128下10"
1083 | }
1084 | ]
1085 | }
1086 | ]
1087 | }
--------------------------------------------------------------------------------
/images/arrow.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webjyh/QQPhoto/80bbc3863c16a4016a1053145f977ff9eb3d9ab9/images/arrow.png
--------------------------------------------------------------------------------
/images/arrow_8.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webjyh/QQPhoto/80bbc3863c16a4016a1053145f977ff9eb3d9ab9/images/arrow_8.png
--------------------------------------------------------------------------------
/images/lazyload.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webjyh/QQPhoto/80bbc3863c16a4016a1053145f977ff9eb3d9ab9/images/lazyload.gif
--------------------------------------------------------------------------------
/images/loading.gif:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webjyh/QQPhoto/80bbc3863c16a4016a1053145f977ff9eb3d9ab9/images/loading.gif
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | 只是测试页面,所有数据全都重复的。留言数据也是如此,只保留当前发送的内容,关闭则全部重置。如在项目开发中,里面许多接口需要和服务端配合。
19 |请使用PHP环境来测试,本页面采用PHP环境测试
20 | 21 | 31 | 32 | 33 | 34 | 46 | 47 | -------------------------------------------------------------------------------- /js/QQPhoto.js: -------------------------------------------------------------------------------- 1 | /** 2 | * QQ.Photo 1.1.0 3 | * Date: 2014-06-15 4 | * (c) 2014-2014 M.J, http://webjyh.com 5 | * 6 | * This is licensed under the GNU LGPL, version 2.1 or later. 7 | * For details, see: http://creativecommons.org/licenses/LGPL/2.1/ 8 | * 9 | */ 10 | (function( $ ){ 11 | 12 | var QQPhoto = function( elem, options ){ 13 | var _this = this; 14 | 15 | this.elem = $( elem ); 16 | this.options = options; 17 | this.index = null; 18 | this.thumbNum = 0; 19 | this.listWidth = 0; 20 | this.liWidth = 0; 21 | this.len = 0; 22 | this.thumbList = []; 23 | this.ulElem = {}; 24 | this.IE6 = !-[1,]&&!window.XMLHttpRequest; 25 | this.image = []; 26 | 27 | this.elem.bind('click', function (event) { event.preventDefault(); _this.init(); return false; }); 28 | }; 29 | 30 | QQPhoto.prototype = { 31 | defaults: { 32 | url : 'data.json', 33 | commentURL : 'comment.json', 34 | fix : 5, 35 | minTextLen : 3, 36 | maxTextLen : 140, 37 | fadeIn : false, 38 | lazyload: 'images/lazyload.gif', 39 | loadding : 'images/loading.gif' 40 | }, 41 | 42 | init: function(){ 43 | var DOM; 44 | 45 | this.config = $.extend( {}, this.defaults, this.options ); 46 | this.DOM = DOM = this._createDOM(); 47 | 48 | // 1.给模板设置样式, 49 | // 2.获取数据并操作 50 | // 3.绑定关闭事件 51 | this 52 | ._setCss() 53 | ._getJSON() 54 | ._closeEvt(); 55 | 56 | return this; 57 | }, 58 | 59 | //获取数据 60 | _getJSON: function () { 61 | var DOM = this.DOM, 62 | _this = this; 63 | 64 | $.getJSON( _this.config.url, function( data ){ 65 | if (typeof data != 'undefined' && data.code > 0) { 66 | _this._data( data ); 67 | } else { 68 | alert(data.msg); 69 | setTimeout(function (){ 70 | DOM.wrap.remove(); 71 | DOM.lock.remove(); 72 | delete QQPhoto; 73 | }, 1500); 74 | } 75 | }).error( function() { 76 | alert("\u83b7\u53d6\u6570\u636e\u51fa\u9519\uff0c\u8bf7\u5237\u65b0\u91cd\u8bd5"); 77 | setTimeout(function () { 78 | DOM.wrap.remove(); 79 | DOM.lock.remove(); 80 | delete QQPhoto; 81 | }, 1500); 82 | }); 83 | 84 | return _this; 85 | }, 86 | 87 | //数据的添加 88 | _data: function( JSON ){ 89 | var DOM = this.DOM, 90 | _this = this, 91 | thumbList = JSON.thumbList, 92 | thumbLen = thumbList.length, 93 | index = this._arrayKey( JSON.showimages, thumbList ); 94 | 95 | this.thumbList = JSON.thumbList; 96 | this.len = thumbLen; 97 | this.index = index; //将Index设置为全局 98 | 99 | // 1.设置当前图片 100 | // 2.创建相册列表, 并设置事件委托 101 | // 3.设置缩略图的事件和位置 102 | // 4~5.列表左右按钮绑定事件 103 | // 6.绑定 resize 事件 104 | 105 | this 106 | ._setData( thumbList[index] ) 107 | ._creaetList( thumbList ) 108 | ._thumbEvent( index ) 109 | ._arrow( thumbList, index ) 110 | ._arrowThumbLeft() 111 | ._arrowThumbRight() 112 | ._commentEvent() 113 | ._resize( thumbLen ); 114 | 115 | return this; 116 | }, 117 | 118 | //给DOM转换数据 119 | _setData: function( obj ){ 120 | var DOM = this.DOM, 121 | _this = this; 122 | 123 | DOM.img.hide(); 124 | DOM.photo.css( "background", "url("+this.config.loadding+") no-repeat center center" ); 125 | 126 | this._loadImage( obj.large, function(){ 127 | DOM.photo.css( "background", "none" ); 128 | DOM.img.attr( 'src', obj.large )[_this.config.fadeIn === true ? "fadeIn":'show'](); 129 | if ( _this.IE6 ){ 130 | _this.image = arguments[0]; 131 | _this._IEImage( arguments[0] ); 132 | } 133 | }); 134 | 135 | DOM.avatar.attr( 'src', obj.avatar ); 136 | DOM.userName.text( obj.user ); 137 | DOM.time.text( obj.time ); 138 | DOM.description.text( obj.desc ); 139 | DOM.count.text( ( parseInt( this.index ) + 1 ) + ' / ' + this.len ); 140 | DOM.title.text( obj.title ); 141 | DOM.pictureid.val( obj.id ); 142 | 143 | _this._createComment( obj.comment ); 144 | 145 | return _this; 146 | }, 147 | 148 | //缩略图 给 li 设置事件委托 149 | _creaetList: function( arr ){ 150 | var _this = this, 151 | DOM = this.DOM, 152 | i = 0, 153 | tpl = '', 154 | arrLen = arr.length; 155 | 156 | for ( ; i < arrLen; i++ ){ 157 | tpl += QQPhoto.li.replace( '{src}', arr[i].thumb ).replace( '{index}', i ).replace( '{lazyload}', this.config.lazyload ); 158 | } 159 | DOM.list.children('div').append( '{msg}
t |
{msg}
' + 669 | '