Ajax Loader
HTML 
<!-- Is it going horizontally or vertically? -->
1
<!-- Is it going horizontally or vertically? -->
2
<table>
3
  <tr>
4
    <td></td>
5
    <td></td>
6
    <td></td>
7
    <td></td>
8
    <td></td>
9
    <td></td>
10
    <td></td>
11
    <td></td>
12
    <td></td>
13
    <td></td>
14
    <td></td>
15
    <td></td>
16
    <td></td>
17
    <td></td>
18
  </tr>
19
  <tr>
20
    <td></td>
21
    <td></td>
22
    <td></td>
23
    <td></td>
24
    <td></td>
25
    <td></td>
26
    <td></td>
27
    <td></td>
28
    <td></td>
29
    <td></td>
30
    <td></td>
31
    <td></td>
32
    <td></td>
33
    <td></td>
34
  </tr>
35
  <tr>
36
    <td></td>
37
    <td></td>
38
    <td></td>
39
    <td></td>
40
    <td></td>
41
    <td></td>
42
    <td></td>
43
    <td></td>
44
    <td></td>
45
    <td></td>
46
    <td></td>
47
    <td></td>
48
    <td></td>
49
    <td></td>
50
  </tr>
51
  <tr>
52
    <td></td>
53
    <td></td>
54
    <td></td>
55
    <td></td>
56
    <td></td>
57
    <td></td>
58
    <td></td>
59
    <td></td>
60
    <td></td>
61
    <td></td>
62
    <td></td>
63
    <td></td>
64
    <td></td>
65
    <td></td>
66
  </tr>
67
  <tr>
68
    <td></td>
69
    <td></td>
70
    <td></td>
71
    <td></td>
72
    <td></td>
73
    <td></td>
74
    <td></td>
75
    <td></td>
76
    <td></td>
77
    <td></td>
78
    <td></td>
79
    <td></td>
80
    <td></td>
81
    <td></td>
82
  </tr>
83
  <tr>
84
    <td></td>
85
    <td></td>
86
    <td></td>
87
    <td></td>
88
    <td></td>
89
    <td></td>
90
    <td></td>
91
    <td></td>
92
    <td></td>
93
    <td></td>
94
    <td></td>
95
    <td></td>
96
    <td></td>
97
    <td></td>
98
  </tr>
99
  <tr>
100
    <td></td>
101
    <td></td>
102
    <td></td>
103
    <td></td>
104
    <td></td>
105
    <td></td>
106
    <td></td>
107
    <td></td>
108
    <td></td>
109
    <td></td>
110
    <td></td>
111
    <td></td>
112
    <td></td>
113
    <td></td>
114
  </tr>
115
  <tr>
116
    <td></td>
117
    <td></td>
118
    <td></td>
119
    <td></td>
120
    <td></td>
121
    <td></td>
122
    <td></td>
123
    <td></td>
124
    <td></td>
125
    <td></td>
126
    <td></td>
127
    <td></td>
128
    <td></td>
129
    <td></td>
130
  </tr>
131
  <tr>
132
    <td></td>
133
    <td></td>
134
    <td></td>
135
    <td></td>
136
    <td></td>
137
    <td></td>
138
    <td></td>
139
    <td></td>
140
    <td></td>
141
    <td></td>
142
    <td></td>
143
    <td></td>
144
    <td></td>
145
    <td></td>
146
  </tr>
147
  <tr>
148
    <td></td>
149
    <td></td>
150
    <td></td>
151
    <td></td>
152
    <td></td>
153
    <td></td>
154
    <td></td>
155
    <td></td>
156
    <td></td>
157
    <td></td>
158
    <td></td>
159
    <td></td>
160
    <td></td>
161
    <td></td>
162
  </tr>
163
  <tr>
164
    <td></td>
165
    <td></td>
166
    <td></td>
167
    <td></td>
168
    <td></td>
169
    <td></td>
170
    <td></td>
171
    <td></td>
172
    <td></td>
173
    <td></td>
174
    <td></td>
175
    <td></td>
176
    <td></td>
177
    <td></td>
178
  </tr>
179
  <tr>
180
    <td></td>
181
    <td></td>
182
    <td></td>
183
    <td></td>
184
    <td></td>
185
    <td></td>
186
    <td></td>
187
    <td></td>
188
    <td></td>
189
    <td></td>
190
    <td></td>
191
    <td></td>
192
    <td></td>
193
    <td></td>
194
  </tr>
195
</table>
196
<table>
197
  <tr>
198
    <td></td>
199
    <td></td>
200
    <td></td>
201
    <td></td>
202
    <td></td>
203
    <td></td>
204
    <td></td>
205
    <td></td>
206
    <td></td>
207
    <td></td>
208
    <td></td>
209
    <td></td>
210
    <td></td>
211
    <td></td>
212
  </tr>
213
  <tr>
214
    <td></td>
215
    <td></td>
216
    <td></td>
217
    <td></td>
218
    <td></td>
219
    <td></td>
220
    <td></td>
221
    <td></td>
222
    <td></td>
223
    <td></td>
224
    <td></td>
225
    <td></td>
226
    <td></td>
227
    <td></td>
228
  </tr>
229
  <tr>
230
    <td></td>
231
    <td></td>
232
    <td></td>
233
    <td></td>
234
    <td></td>
235
    <td></td>
236
    <td></td>
237
    <td></td>
238
    <td></td>
239
    <td></td>
240
    <td></td>
241
    <td></td>
242
    <td></td>
243
    <td></td>
244
  </tr>
245
  <tr>
246
    <td></td>
247
    <td></td>
248
    <td></td>
249
    <td></td>
250
    <td></td>
251
    <td></td>
252
    <td></td>
253
    <td></td>
254
    <td></td>
255
    <td></td>
256
    <td></td>
257
    <td></td>
258
    <td></td>
259
    <td></td>
260
  </tr>
261
  <tr>
262
    <td></td>
263
    <td></td>
264
    <td></td>
265
    <td></td>
266
    <td></td>
267
    <td></td>
268
    <td></td>
269
    <td></td>
270
    <td></td>
271
    <td></td>
272
    <td></td>
273
    <td></td>
274
    <td></td>
275
    <td></td>
276
  </tr>
277
  <tr>
278
    <td></td>
279
    <td></td>
280
    <td></td>
281
    <td></td>
282
    <td></td>
283
    <td></td>
284
    <td></td>
285
    <td></td>
286
    <td></td>
287
    <td></td>
288
    <td></td>
289
    <td></td>
290
    <td></td>
291
    <td></td>
292
  </tr>
293
  <tr>
294
    <td></td>
295
    <td></td>
296
    <td></td>
297
    <td></td>
298
    <td></td>
299
    <td></td>
300
    <td></td>
301
    <td></td>
302
    <td></td>
303
    <td></td>
304
    <td></td>
305
    <td></td>
306
    <td></td>
307
    <td></td>
308
  </tr>
309
  <tr>
310
    <td></td>
311
    <td></td>
312
    <td></td>
313
    <td></td>
314
    <td></td>
315
    <td></td>
316
    <td></td>
317
    <td></td>
318
    <td></td>
319
    <td></td>
320
    <td></td>
321
    <td></td>
322
    <td></td>
323
    <td></td>
324
  </tr>
325
  <tr>
326
    <td></td>
327
    <td></td>
328
    <td></td>
329
    <td></td>
330
    <td></td>
331
    <td></td>
332
    <td></td>
333
    <td></td>
334
    <td></td>
335
    <td></td>
336
    <td></td>
337
    <td></td>
338
    <td></td>
339
    <td></td>
340
  </tr>
341
  <tr>
342
    <td></td>
343
    <td></td>
344
    <td></td>
345
    <td></td>
346
    <td></td>
347
    <td></td>
348
    <td></td>
349
    <td></td>
350
    <td></td>
351
    <td></td>
352
    <td></td>
353
    <td></td>
354
    <td></td>
355
    <td></td>
356
  </tr>
357
  <tr>
358
    <td></td>
359
    <td></td>
360
    <td></td>
361
    <td></td>
362
    <td></td>
363
    <td></td>
364
    <td></td>
365
    <td></td>
366
    <td></td>
367
    <td></td>
368
    <td></td>
369
    <td></td>
370
    <td></td>
371
    <td></td>
372
  </tr>
373
  <tr>
374
    <td></td>
375
    <td></td>
376
    <td></td>
377
    <td></td>
378
    <td></td>
379
    <td></td>
380
    <td></td>
381
    <td></td>
382
    <td></td>
383
    <td></td>
384
    <td></td>
385
    <td></td>
386
    <td></td>
387
    <td></td>
388
  </tr>
389
</table>
 
CSS 
body { background:black; overflow:hidden; }
1
body { background:black; overflow:hidden; }
2
/* Is it going vertically or horizontally? */
3
table {
4
  position:absolute;
5
  left:880px;
6
  top:-100px;
7
  margin-top:-800px;
8
  -webkit-transform: rotate(45deg);
9
  -webkit-transform-origin: top left;
10
  -webkit-transform-style: preserve-3D;
11
  transform: rotate(45deg);
12
  transform-origin: top left;
13
  transform-style: preserve-3D;
14
  width:2200px;
15
  border-collapse:collapse;
16
}
17
table:nth-of-type(1) {
18
  -webkit-animation:moveup 2s linear infinite;
19
  animation:moveup 2s linear infinite;
20
}
21
table:nth-of-type(2) {
22
  -webkit-animation:moveup 2s linear reverse infinite;
23
  animation:moveup 2s linear reverse infinite;
24
}
25
table tr td {
26
  height:150px; width:150px;
27
  float:left;
28
  border: 2px solid white;
29
}
30
@-webkit-keyframes moveup {
31
  from { margin-top:-800px; }
32
  to   { margin-top:-1015px; }
33
}
34
@keyframes moveup {
35
  from { margin-top:-800px; }
36
  to   { margin-top:-1015px; }
37
}
 

Line Illusion

CSSDeck G+