5a1acb6e4254329af87964788c36e0d0c3928e58.svn-base 15 KB

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