懒羊羊
2023-08-30 1ac2bc1590406d9babec036e154d8d08f34a6aa1
提交 | 用户 | 时间
1ac2bc 1 @charset "utf-8";
2 .wrapper{ width: 570px;_width:575px;margin: 10px auto; zoom:1;position: relative}
3 .tabbody{height: 335px;}
4 .tabbody .panel {
5     position: absolute;
6     width: 0;
7     height: 0;
8     background: #fff;
9     overflow: hidden;
10     display: none;
11 }
12 .tabbody .panel.focus {
13     width: 100%;
14     height: 335px;
15     display: block;
16 }
17
18 .tabbody .panel table td{vertical-align: middle;}
19 #videoUrl {
20     width: 490px;
21     height: 21px;
22     line-height: 21px;
23     margin: 8px 5px;
24     background: #FFF;
25     border: 1px solid #d7d7d7;
26 }
27 #videoSearchTxt{margin-left:15px;background: #FFF;width:200px;height:21px;line-height:21px;border: 1px solid #d7d7d7;}
28 #searchList{width: 570px;overflow: auto;zoom:1;height: 270px;}
29 #searchList div{float: left;width: 120px;height: 135px;margin: 5px 15px;}
30 #searchList img{margin: 2px 8px;cursor: pointer;border: 2px solid #fff} /*不用缩略图*/
31 #searchList p{margin-left: 10px;}
32 #videoType{
33     width: 65px;
34     height: 23px;
35     line-height: 22px;
36     border: 1px solid #d7d7d7;
37 }
38 #videoSearchBtn,#videoSearchReset{
39     /*width: 80px;*/
40     height: 25px;
41     line-height: 25px;
42     background: #eee;
43     border: 1px solid #d7d7d7;
44     cursor: pointer;
45     padding: 0 5px;
46 }
47
48
49
50 #preview{position: relative;width: 420px;padding:0;overflow: hidden; margin-left: 10px; _margin-left:5px; height: 280px;background-color: #ddd;float: left}
51 #preview .previewMsg {position:absolute;top:0;margin:0;padding:0;height:280px;width:100%;background-color: #666;}
52 #preview .previewMsg span{display:block;margin: 125px auto 0 auto;text-align:center;font-size:18px;color:#fff;}
53 #preview .previewVideo {position:absolute;top:0;margin:0;padding:0;height:280px;width:100%;}
54 .edui-video-wrapper fieldset{
55     border: 1px solid #ddd;
56     padding-left: 5px;
57     margin-bottom: 20px;
58     padding-bottom: 5px;
59     width: 115px;
60 }
61
62 #videoInfo {width: 120px;float: left;margin-left: 10px;_margin-left:7px;}
63 fieldset{
64     border: 1px solid #ddd;
65     padding-left: 5px;
66     margin-bottom: 20px;
67     padding-bottom: 5px;
68     width: 115px;
69 }
70 fieldset legend{font-weight: bold;}
71 fieldset p{line-height: 30px;}
72 fieldset input.txt{
73     width: 65px;
74     height: 21px;
75     line-height: 21px;
76     margin: 8px 5px;
77     background: #FFF;
78     border: 1px solid #d7d7d7;
79 }
80 label.url{font-weight: bold;margin-left: 5px;color: #06c;}
81 #videoFloat div{cursor:pointer;opacity: 0.5;filter: alpha(opacity = 50);margin:9px;_margin:5px;width:38px;height:36px;float:left;}
82 #videoFloat .focus{opacity: 1;filter: alpha(opacity = 100)}
83 span.view{display: inline-block;width: 30px;float: right;cursor: pointer;color: blue}
84
85
86
87
88 /* upload video */
89 .tabbody #upload.panel {
90     width: 0;
91     height: 0;
92     overflow: hidden;
93     position: absolute !important;
94     clip: rect(1px, 1px, 1px, 1px);
95     background: #fff;
96     display: block;
97 }
98 .tabbody #upload.panel.focus {
99     width: 100%;
100     height: 335px;
101     display: block;
102     clip: auto;
103 }
104 #upload_alignment div{cursor:pointer;opacity: 0.5;filter: alpha(opacity = 50);margin:9px;_margin:5px;width:38px;height:36px;float:left;}
105 #upload_alignment .focus{opacity: 1;filter: alpha(opacity = 100)}
106 #upload_left { width:427px; float:left; }
107 #upload_left .controller { height: 30px; clear: both; }
108 #uploadVideoInfo{margin-top:10px;float:right;padding-right:8px;}
109
110 #upload .queueList {
111     margin: 0;
112 }
113
114 #upload p {
115     margin: 0;
116 }
117
118 .element-invisible {
119     width: 0 !important;
120     height: 0 !important;
121     border: 0;
122     padding: 0;
123     margin: 0;
124     overflow: hidden;
125     position: absolute !important;
126     clip: rect(1px, 1px, 1px, 1px);
127 }
128
129 #upload .placeholder {
130     margin: 10px;
131     margin-right:0;
132     border: 2px dashed #e6e6e6;
133     *border: 0px dashed #e6e6e6;
134     height: 161px;
135     padding-top: 150px;
136     text-align: center;
137     width: 97%;
138     float: left;
139     background: url(./images/image.png) center 70px no-repeat;
140     color: #cccccc;
141     font-size: 18px;
142     position: relative;
143     top:0;
144     *margin-left: 0;
145     *left: 10px;
146 }
147
148 #upload .placeholder .webuploader-pick {
149     font-size: 18px;
150     background: #00b7ee;
151     border-radius: 3px;
152     line-height: 44px;
153     padding: 0 30px;
154     *width: 120px;
155     color: #fff;
156     display: inline-block;
157     margin: 0 auto 20px auto;
158     cursor: pointer;
159     box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
160 }
161
162 #upload .placeholder .webuploader-pick-hover {
163     background: #00a2d4;
164 }
165
166
167 #filePickerContainer {
168     text-align: center;
169 }
170
171 #upload .placeholder .flashTip {
172     color: #666666;
173     font-size: 12px;
174     position: absolute;
175     width: 100%;
176     text-align: center;
177     bottom: 20px;
178 }
179
180 #upload .placeholder .flashTip a {
181     color: #0785d1;
182     text-decoration: none;
183 }
184
185 #upload .placeholder .flashTip a:hover {
186     text-decoration: underline;
187 }
188
189 #upload .placeholder.webuploader-dnd-over {
190     border-color: #999999;
191 }
192
193 #upload .filelist {
194     list-style: none;
195     margin: 0;
196     padding: 0;
197     overflow-x: hidden;
198     overflow-y: auto;
199     position: relative;
200     height: 285px;
201 }
202
203 #upload .filelist:after {
204     content: '';
205     display: block;
206     width: 0;
207     height: 0;
208     overflow: hidden;
209     clear: both;
210 }
211
212 #upload .filelist li {
213     width: 113px;
214     height: 113px;
215     background: url(./images/bg.png);
216     text-align: center;
217     margin: 15px 0 0 20px;
218     *margin: 15px 0 0 15px;
219     position: relative;
220     display: block;
221     float: left;
222     overflow: hidden;
223     font-size: 12px;
224 }
225
226 #upload .filelist li p.log {
227     position: relative;
228     top: -45px;
229 }
230
231 #upload .filelist li p.title {
232     position: absolute;
233     top: 0;
234     left: 0;
235     width: 100%;
236     overflow: hidden;
237     white-space: nowrap;
238     text-overflow: ellipsis;
239     top: 5px;
240     text-indent: 5px;
241     text-align: left;
242 }
243
244 #upload .filelist li p.progress {
245     position: absolute;
246     width: 100%;
247     bottom: 0;
248     left: 0;
249     height: 8px;
250     overflow: hidden;
251     z-index: 50;
252     margin: 0;
253     border-radius: 0;
254     background: none;
255     -webkit-box-shadow: 0 0 0;
256 }
257
258 #upload .filelist li p.progress span {
259     display: none;
260     overflow: hidden;
261     width: 0;
262     height: 100%;
263     background: #1483d8 url(./images/progress.png) repeat-x;
264
265     -webit-transition: width 200ms linear;
266     -moz-transition: width 200ms linear;
267     -o-transition: width 200ms linear;
268     -ms-transition: width 200ms linear;
269     transition: width 200ms linear;
270
271     -webkit-animation: progressmove 2s linear infinite;
272     -moz-animation: progressmove 2s linear infinite;
273     -o-animation: progressmove 2s linear infinite;
274     -ms-animation: progressmove 2s linear infinite;
275     animation: progressmove 2s linear infinite;
276
277     -webkit-transform: translateZ(0);
278 }
279
280 @-webkit-keyframes progressmove {
281     0% {
282         background-position: 0 0;
283     }
284     100% {
285         background-position: 17px 0;
286     }
287 }
288
289 @-moz-keyframes progressmove {
290     0% {
291         background-position: 0 0;
292     }
293     100% {
294         background-position: 17px 0;
295     }
296 }
297
298 @keyframes progressmove {
299     0% {
300         background-position: 0 0;
301     }
302     100% {
303         background-position: 17px 0;
304     }
305 }
306
307 #upload .filelist li p.imgWrap {
308     position: relative;
309     z-index: 2;
310     line-height: 113px;
311     vertical-align: middle;
312     overflow: hidden;
313     width: 113px;
314     height: 113px;
315
316     -webkit-transform-origin: 50% 50%;
317     -moz-transform-origin: 50% 50%;
318     -o-transform-origin: 50% 50%;
319     -ms-transform-origin: 50% 50%;
320     transform-origin: 50% 50%;
321
322     -webit-transition: 200ms ease-out;
323     -moz-transition: 200ms ease-out;
324     -o-transition: 200ms ease-out;
325     -ms-transition: 200ms ease-out;
326     transition: 200ms ease-out;
327 }
328 #upload .filelist li p.imgWrap.notimage {
329     margin-top: 0;
330     width: 111px;
331     height: 111px;
332     border: 1px #eeeeee solid;
333 }
334 #upload .filelist li p.imgWrap.notimage i.file-preview {
335     margin-top: 15px;
336 }
337
338 #upload .filelist li img {
339     width: 100%;
340 }
341
342 #upload .filelist li p.error {
343     background: #f43838;
344     color: #fff;
345     position: absolute;
346     bottom: 0;
347     left: 0;
348     height: 28px;
349     line-height: 28px;
350     width: 100%;
351     z-index: 100;
352     display:none;
353 }
354
355 #upload .filelist li .success {
356     display: block;
357     position: absolute;
358     left: 0;
359     bottom: 0;
360     height: 40px;
361     width: 100%;
362     z-index: 200;
363     background: url(./images/success.png) no-repeat right bottom;
364     background-image: url(./images/success.gif) \9;
365 }
366
367 #upload .filelist li.filePickerBlock {
368     width: 113px;
369     height: 113px;
370     background: url(./images/image.png) no-repeat center 12px;
371     border: 1px solid #eeeeee;
372     border-radius: 0;
373 }
374 #upload .filelist li.filePickerBlock div.webuploader-pick  {
375     width: 100%;
376     height: 100%;
377     margin: 0;
378     padding: 0;
379     opacity: 0;
380     background: none;
381     font-size: 0;
382 }
383
384 #upload .filelist div.file-panel {
385     position: absolute;
386     height: 0;
387     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#80000000', endColorstr='#80000000') \0;
388     background: rgba(0, 0, 0, 0.5);
389     width: 100%;
390     top: 0;
391     left: 0;
392     overflow: hidden;
393     z-index: 300;
394 }
395
396 #upload .filelist div.file-panel span {
397     width: 24px;
398     height: 24px;
399     display: inline;
400     float: right;
401     text-indent: -9999px;
402     overflow: hidden;
403     background: url(./images/icons.png) no-repeat;
404     background: url(./images/icons.gif) no-repeat \9;
405     margin: 5px 1px 1px;
406     cursor: pointer;
407     -webkit-tap-highlight-color: rgba(0,0,0,0);
408     -webkit-user-select: none;
409     -moz-user-select: none;
410     -ms-user-select: none;
411     user-select: none;
412 }
413
414 #upload .filelist div.file-panel span.rotateLeft {
415     display:none;
416     background-position: 0 -24px;
417 }
418
419 #upload .filelist div.file-panel span.rotateLeft:hover {
420     background-position: 0 0;
421 }
422
423 #upload .filelist div.file-panel span.rotateRight {
424     display:none;
425     background-position: -24px -24px;
426 }
427
428 #upload .filelist div.file-panel span.rotateRight:hover {
429     background-position: -24px 0;
430 }
431
432 #upload .filelist div.file-panel span.cancel {
433     background-position: -48px -24px;
434 }
435
436 #upload .filelist div.file-panel span.cancel:hover {
437     background-position: -48px 0;
438 }
439
440 #upload .statusBar {
441     height: 45px;
442     border-bottom: 1px solid #dadada;
443     margin: 0 10px;
444     padding: 0;
445     line-height: 45px;
446     vertical-align: middle;
447     position: relative;
448 }
449
450 #upload .statusBar .progress {
451     border: 1px solid #1483d8;
452     width: 198px;
453     background: #fff;
454     height: 18px;
455     position: absolute;
456     top: 12px;
457     display: none;
458     text-align: center;
459     line-height: 18px;
460     color: #6dbfff;
461     margin: 0 10px 0 0;
462 }
463 #upload .statusBar .progress span.percentage {
464     width: 0;
465     height: 100%;
466     left: 0;
467     top: 0;
468     background: #1483d8;
469     position: absolute;
470 }
471 #upload .statusBar .progress span.text {
472     position: relative;
473     z-index: 10;
474 }
475
476 #upload .statusBar .info {
477     display: inline-block;
478     font-size: 14px;
479     color: #666666;
480 }
481
482 #upload .statusBar .btns {
483     position: absolute;
484     top: 7px;
485     right: 0;
486     line-height: 30px;
487 }
488
489 #filePickerBtn {
490     display: inline-block;
491     float: left;
492 }
493 #upload .statusBar .btns .webuploader-pick,
494 #upload .statusBar .btns .uploadBtn,
495 #upload .statusBar .btns .uploadBtn.state-uploading,
496 #upload .statusBar .btns .uploadBtn.state-paused {
497     background: #ffffff;
498     border: 1px solid #cfcfcf;
499     color: #565656;
500     padding: 0 18px;
501     display: inline-block;
502     border-radius: 3px;
503     margin-left: 10px;
504     cursor: pointer;
505     font-size: 14px;
506     float: left;
507     -webkit-user-select: none;
508     -moz-user-select: none;
509     -ms-user-select: none;
510     user-select: none;
511 }
512 #upload .statusBar .btns .webuploader-pick-hover,
513 #upload .statusBar .btns .uploadBtn:hover,
514 #upload .statusBar .btns .uploadBtn.state-uploading:hover,
515 #upload .statusBar .btns .uploadBtn.state-paused:hover {
516     background: #f0f0f0;
517 }
518
519 #upload .statusBar .btns .uploadBtn,
520 #upload .statusBar .btns .uploadBtn.state-paused{
521     background: #00b7ee;
522     color: #fff;
523     border-color: transparent;
524 }
525 #upload .statusBar .btns .uploadBtn:hover,
526 #upload .statusBar .btns .uploadBtn.state-paused:hover{
527     background: #00a2d4;
528 }
529
530 #upload .statusBar .btns .uploadBtn.disabled {
531     pointer-events: none;
532     filter:alpha(opacity=60);
533     -moz-opacity:0.6;
534     -khtml-opacity: 0.6;
535     opacity: 0.6;
536 }
537
538
539 /* 在线文件的文件预览图标 */
540 i.file-preview {
541     display: block;
542     margin: 10px auto;
543     width: 70px;
544     height: 70px;
545     background-image: url("./images/file-icons.png");
546     background-image: url("./images/file-icons.gif") \9;
547     background-position: -140px center;
548     background-repeat: no-repeat;
549 }
550 i.file-preview.file-type-dir{
551     background-position: 0 center;
552 }
553 i.file-preview.file-type-file{
554     background-position: -140px center;
555 }
556 i.file-preview.file-type-filelist{
557     background-position: -210px center;
558 }
559 i.file-preview.file-type-zip,
560 i.file-preview.file-type-rar,
561 i.file-preview.file-type-7z,
562 i.file-preview.file-type-tar,
563 i.file-preview.file-type-gz,
564 i.file-preview.file-type-bz2{
565     background-position: -280px center;
566 }
567 i.file-preview.file-type-xls,
568 i.file-preview.file-type-xlsx{
569     background-position: -350px center;
570 }
571 i.file-preview.file-type-doc,
572 i.file-preview.file-type-docx{
573     background-position: -420px center;
574 }
575 i.file-preview.file-type-ppt,
576 i.file-preview.file-type-pptx{
577     background-position: -490px center;
578 }
579 i.file-preview.file-type-vsd{
580     background-position: -560px center;
581 }
582 i.file-preview.file-type-pdf{
583     background-position: -630px center;
584 }
585 i.file-preview.file-type-txt,
586 i.file-preview.file-type-md,
587 i.file-preview.file-type-json,
588 i.file-preview.file-type-htm,
589 i.file-preview.file-type-xml,
590 i.file-preview.file-type-html,
591 i.file-preview.file-type-js,
592 i.file-preview.file-type-css,
593 i.file-preview.file-type-php,
594 i.file-preview.file-type-jsp,
595 i.file-preview.file-type-asp{
596     background-position: -700px center;
597 }
598 i.file-preview.file-type-apk{
599     background-position: -770px center;
600 }
601 i.file-preview.file-type-exe{
602     background-position: -840px center;
603 }
604 i.file-preview.file-type-ipa{
605     background-position: -910px center;
606 }
607 i.file-preview.file-type-mp4,
608 i.file-preview.file-type-swf,
609 i.file-preview.file-type-mkv,
610 i.file-preview.file-type-avi,
611 i.file-preview.file-type-flv,
612 i.file-preview.file-type-mov,
613 i.file-preview.file-type-mpg,
614 i.file-preview.file-type-mpeg,
615 i.file-preview.file-type-ogv,
616 i.file-preview.file-type-webm,
617 i.file-preview.file-type-rm,
618 i.file-preview.file-type-rmvb{
619     background-position: -980px center;
620 }
621 i.file-preview.file-type-ogg,
622 i.file-preview.file-type-wav,
623 i.file-preview.file-type-wmv,
624 i.file-preview.file-type-mid,
625 i.file-preview.file-type-mp3{
626     background-position: -1050px center;
627 }
628 i.file-preview.file-type-jpg,
629 i.file-preview.file-type-jpeg,
630 i.file-preview.file-type-gif,
631 i.file-preview.file-type-bmp,
632 i.file-preview.file-type-png,
633 i.file-preview.file-type-psd{
634     background-position: -140px center;
635 }