jquery.cropbox.css 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. .cropFrame {
  2. overflow : hidden;
  3. position : relative;
  4. display: inline-block;
  5. }
  6. .cropImage {
  7. position : absolute;
  8. top : 0;
  9. left : 0;
  10. cursor : move;
  11. max-width: none;
  12. }
  13. .cropControls {
  14. background : #000;
  15. width : 100%;
  16. height : 26px;
  17. position : absolute;
  18. z-index : 100;
  19. bottom : 0;
  20. left : 0;
  21. opacity : 0;
  22. filter : alpha(opacity=0);
  23. transition : opacity .25s linear;
  24. -moz-transition : opacity .25s linear;
  25. -webkit-transition : opacity .25s linear;
  26. t-touch-callout: none;
  27. -webkit-user-select: none;
  28. -khtml-user-select: none;
  29. -moz-user-select: none;
  30. -ms-user-select: none;
  31. user-select: none;
  32. }
  33. .cropFrame.hover .cropControls {
  34. opacity : .55;
  35. filter : alpha(opacity=55);
  36. }
  37. .cropControls span {
  38. display : block;
  39. float : left;
  40. color : #fff;
  41. font-size : 11px;
  42. margin : 7px 0 0 5px;
  43. }
  44. .cropZoomIn,
  45. .cropZoomOut {
  46. display : block;
  47. float : right;
  48. margin : 4px 4px 0 0;
  49. padding : 0;
  50. background : #fff;
  51. border: 1px solid #000;
  52. color : #000;
  53. border-radius : 4px;
  54. width : 18px;
  55. height : 18px;
  56. line-height : 16px;
  57. font-size : 18px;
  58. text-align : center;
  59. text-decoration : none;
  60. cursor : pointer;
  61. }
  62. .cropZoomIn::after,
  63. .cropZoomIn .after {
  64. content : "+";
  65. display : block;
  66. text-align:center;
  67. }
  68. .cropZoomOut::after,
  69. .cropZoomOut .after {
  70. content : "-";
  71. display : block;
  72. text-align:center;
  73. }
  74. /*IE8*/
  75. .cropZoomIn:after,
  76. .cropZoomIn .after {
  77. content : "+";
  78. display : block;
  79. text-align:center;
  80. }
  81. /*IE8*/
  82. .cropZoomOut:after,
  83. .cropZoomOut .after {
  84. content : "-";
  85. display : block;
  86. text-align:center;
  87. }