diff options
Diffstat (limited to 'htdocs/cropper/cropper.css')
| -rw-r--r-- | htdocs/cropper/cropper.css | 182 |
1 files changed, 182 insertions, 0 deletions
diff --git a/htdocs/cropper/cropper.css b/htdocs/cropper/cropper.css new file mode 100644 index 0000000..c2e7598 --- /dev/null +++ b/htdocs/cropper/cropper.css @@ -0,0 +1,182 @@ +.imgCrop_wrap {
+ /* width: 500px; @done_in_js */
+ /* height: 375px; @done_in_js */
+ position: relative;
+ cursor: crosshair;
+}
+
+/* an extra classname is applied for Opera < 9.0 to fix it's lack of opacity support */
+.imgCrop_wrap.opera8 .imgCrop_overlay,
+.imgCrop_wrap.opera8 .imgCrop_clickArea {
+ background-color: transparent;
+}
+
+/* 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 */
+.imgCrop_wrap,
+.imgCrop_wrap * {
+ font-size: 0;
+}
+
+.imgCrop_overlay {
+ background-color: #000;
+ opacity: 0.5;
+ filter:alpha(opacity=50);
+ position: absolute;
+ width: 100%;
+ height: 100%;
+}
+
+.imgCrop_selArea {
+ position: absolute;
+ /* @done_in_js
+ top: 20px;
+ left: 20px;
+ width: 200px;
+ height: 200px;
+ background: transparent url(castle.jpg) no-repeat -210px -110px;
+ */
+ cursor: move;
+ z-index: 2;
+}
+
+/* clickArea is all a fix for IE 5.5 & 6 to allow the user to click on the given area */
+.imgCrop_clickArea {
+ width: 100%;
+ height: 100%;
+ background-color: #FFF;
+ opacity: 0.01;
+ filter:alpha(opacity=01);
+}
+
+.imgCrop_marqueeHoriz {
+ position: absolute;
+ width: 100%;
+ height: 1px;
+ background: transparent url(marqueeHoriz.gif) repeat-x 0 0;
+ z-index: 3;
+}
+
+.imgCrop_marqueeVert {
+ position: absolute;
+ height: 100%;
+ width: 1px;
+ background: transparent url(marqueeVert.gif) repeat-y 0 0;
+ z-index: 3;
+}
+
+/*
+ * FIX MARCHING ANTS IN IE
+ * As IE <6 tries to load background images we can uncomment the follwoing hack
+ * to remove that issue, not as pretty - but is anything in IE?
+ * And yes I do know that 'filter' is evil, but it will make it look semi decent in IE
+ *
+* html .imgCrop_marqueeHoriz,
+* html .imgCrop_marqueeVert {
+ background: transparent;
+ filter: Invert;
+}
+* html .imgCrop_marqueeNorth { border-top: 1px dashed #000; }
+* html .imgCrop_marqueeEast { border-right: 1px dashed #000; }
+* html .imgCrop_marqueeSouth { border-bottom: 1px dashed #000; }
+* html .imgCrop_marqueeWest { border-left: 1px dashed #000; }
+*/
+
+.imgCrop_marqueeNorth { top: 0; left: 0; }
+.imgCrop_marqueeEast { top: 0; right: 0; }
+.imgCrop_marqueeSouth { bottom: 0px; left: 0; }
+.imgCrop_marqueeWest { top: 0; left: 0; }
+
+
+.imgCrop_handle {
+ position: absolute;
+ border: 1px solid #333;
+ width: 6px;
+ height: 6px;
+ background: #FFF;
+ opacity: 0.5;
+ filter:alpha(opacity=50);
+ z-index: 4;
+}
+
+/* fix IE 5 box model */
+* html .imgCrop_handle {
+ width: 8px;
+ height: 8px;
+ wid\th: 6px;
+ hei\ght: 6px;
+}
+
+.imgCrop_handleN {
+ top: -3px;
+ left: 0;
+ /* margin-left: 49%; @done_in_js */
+ cursor: n-resize;
+}
+
+.imgCrop_handleNE {
+ top: -3px;
+ right: -3px;
+ cursor: ne-resize;
+}
+
+.imgCrop_handleE {
+ top: 0;
+ right: -3px;
+ /* margin-top: 49%; @done_in_js */
+ cursor: e-resize;
+}
+
+.imgCrop_handleSE {
+ right: -3px;
+ bottom: -3px;
+ cursor: se-resize;
+}
+
+.imgCrop_handleS {
+ right: 0;
+ bottom: -3px;
+ /* margin-right: 49%; @done_in_js */
+ cursor: s-resize;
+}
+
+.imgCrop_handleSW {
+ left: -3px;
+ bottom: -3px;
+ cursor: sw-resize;
+}
+
+.imgCrop_handleW {
+ top: 0;
+ left: -3px;
+ /* margin-top: 49%; @done_in_js */
+ cursor: w-resize;
+}
+
+.imgCrop_handleNW {
+ top: -3px;
+ left: -3px;
+ cursor: nw-resize;
+}
+
+/**
+ * Create an area to click & drag around on as the default browser behaviour is to let you drag the image
+ */
+.imgCrop_dragArea {
+ width: 100%;
+ height: 100%;
+ z-index: 200;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+.imgCrop_previewWrap {
+ /* width: 200px; @done_in_js */
+ /* height: 200px; @done_in_js */
+ overflow: hidden;
+ position: relative;
+}
+
+.imgCrop_previewWrap img {
+ position: absolute;
+}
\ No newline at end of file |