home *** CD-ROM | disk | FTP | other *** search
/ Cricao de Sites - 650 Layouts Prontos / WebMasters.iso / Blogs / wordpress2.6.exe / wordpress2.6 / wp-includes / js / crop / cropper.css next >
Encoding:
Cascading Style Sheet File  |  2008-03-03  |  2.9 KB  |  165 lines
  1. .imgCrop_wrap {
  2.     /* width: 500px;   @done_in_js */
  3.     /* height: 375px;  @done_in_js */
  4.     position: relative;
  5.     cursor: crosshair;
  6. }
  7.  
  8. /* an extra classname is applied for Opera < 9.0 to fix it's lack of opacity support */
  9. .imgCrop_wrap.opera8 .imgCrop_overlay,
  10. .imgCrop_wrap.opera8 .imgCrop_clickArea { 
  11.     background-color: transparent;
  12. }
  13.  
  14. /* fix for IE displaying all boxes at line-height by default, although they are still 1 pixel high until we combine them with the pointless span */
  15. .imgCrop_wrap,
  16. .imgCrop_wrap * {
  17.     font-size: 0;
  18. }
  19.  
  20. .imgCrop_overlay {
  21.     background-color: #000;
  22.     opacity: 0.5;
  23.     filter:alpha(opacity=50);
  24.     position: absolute;
  25.     width: 100%;
  26.     height: 100%;
  27. }
  28.  
  29. .imgCrop_selArea {
  30.     position: absolute;
  31.     /* @done_in_js 
  32.     top: 20px;
  33.     left: 20px;
  34.     width: 200px;
  35.     height: 200px;
  36.     background: transparent url(castle.jpg) no-repeat  -210px -110px;
  37.     */
  38.     cursor: move;
  39.     z-index: 2;
  40. }
  41.  
  42. /* clickArea is all a fix for IE 5.5 & 6 to allow the user to click on the given area */
  43. .imgCrop_clickArea {
  44.     width: 100%;
  45.     height: 100%;
  46.     background-color: #FFF;
  47.     opacity: 0.01;
  48.     filter:alpha(opacity=01);
  49. }
  50.  
  51. .imgCrop_marqueeHoriz {
  52.     position: absolute;
  53.     width: 100%;
  54.     height: 1px;
  55.     background: transparent url(marqueeHoriz.gif) repeat-x 0 0;
  56.     z-index: 3;
  57. }
  58.  
  59. .imgCrop_marqueeVert {
  60.     position: absolute;
  61.     height: 100%;
  62.     width: 1px;
  63.     background: transparent url(marqueeVert.gif) repeat-y 0 0;
  64.     z-index: 3;
  65. }
  66.  
  67. .imgCrop_marqueeNorth { top: 0; left: 0; }
  68. .imgCrop_marqueeEast  { top: 0; right: 0; }
  69. .imgCrop_marqueeSouth { bottom: 0px; left: 0; }
  70. .imgCrop_marqueeWest  { top: 0; left: 0; }
  71.  
  72.  
  73. .imgCrop_handle {
  74.     position: absolute;
  75.     border: 1px solid #333;
  76.     width: 6px;
  77.     height: 6px;
  78.     background: #FFF;
  79.     opacity: 0.5;
  80.     filter:alpha(opacity=50);
  81.     z-index: 4;
  82. }
  83.  
  84. /* fix IE 5 box model */
  85. * html .imgCrop_handle {
  86.     width: 8px;
  87.     height: 8px;
  88.     wid\th: 6px;
  89.     hei\ght: 6px;
  90. }
  91.  
  92. .imgCrop_handleN {
  93.     top: -3px;
  94.     left: 0;
  95.     /* margin-left: 49%;    @done_in_js */
  96.     cursor: n-resize;
  97. }
  98.  
  99. .imgCrop_handleNE { 
  100.     top: -3px;
  101.     right: -3px;
  102.     cursor: ne-resize;
  103. }
  104.  
  105. .imgCrop_handleE {
  106.     top: 0;
  107.     right: -3px;
  108.     /* margin-top: 49%;    @done_in_js */
  109.     cursor: e-resize;
  110. }
  111.  
  112. .imgCrop_handleSE {
  113.     right: -3px;
  114.     bottom: -3px;
  115.     cursor: se-resize;
  116. }
  117.  
  118. .imgCrop_handleS {
  119.     right: 0;
  120.     bottom: -3px;
  121.     /* margin-right: 49%; @done_in_js */
  122.     cursor: s-resize;
  123. }
  124.  
  125. .imgCrop_handleSW {
  126.     left: -3px;
  127.     bottom: -3px;
  128.     cursor: sw-resize;
  129. }
  130.  
  131. .imgCrop_handleW {
  132.     top: 0;
  133.     left: -3px;
  134.     /* margin-top: 49%;  @done_in_js */
  135.     cursor: e-resize;
  136. }
  137.  
  138. .imgCrop_handleNW {
  139.     top: -3px;
  140.     left: -3px;
  141.     cursor: nw-resize;
  142. }
  143.  
  144. /**
  145.  * Create an area to click & drag around on as the default browser behaviour is to let you drag the image 
  146.  */
  147. .imgCrop_dragArea {
  148.     width: 100%;
  149.     height: 100%;
  150.     z-index: 200;
  151.     position: absolute;
  152.     top: 0;
  153.     left: 0;
  154. }
  155.  
  156. .imgCrop_previewWrap {
  157.     /* width: 200px;  @done_in_js */
  158.     /* height: 200px; @done_in_js */
  159.     overflow: hidden;
  160.     position: relative;
  161. }
  162.  
  163. .imgCrop_previewWrap img {
  164.     position: absolute;
  165. }