You are here

Home » API reference » Image javascript crop 6

jquery.Jcrop.css in Image javascript crop 6 

/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */
.jcrop-holder { text-align: left; }

.jcrop-vline, .jcrop-hline
{
	font-size: 0px;
	position: absolute;
	background: white url('Jcrop.gif') top left repeat;
}
.jcrop-vline { height: 100%; width: 1px !important; }
.jcrop-hline { width: 100%; height: 1px !important; }
.jcrop-vline.right { right: 0px; }
.jcrop-hline.bottom { bottom: 0px; }
.jcrop-handle {
	font-size: 1px;
	width: 7px !important;
	height: 7px !important;
	border: 1px #eee solid;
	background-color: #333;
}

.jcrop-tracker { width: 100%; height: 100%; }

.custom .jcrop-vline,
.custom .jcrop-hline
{
	background: yellow;
}
.custom .jcrop-handle
{
	border-color: black;
	background-color: #C7BB00;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}


/*over rides for normal cropping css*/
body #image-crop-container{ background-color: transparent; }
body #image-crop-container{ opacity:1;visibility:hidden; }

File

jcrop/jquery.Jcrop.css
View source 
  1. /* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */

  2. .jcrop-holder { text-align: left; }

  3. 

  4. .jcrop-vline, .jcrop-hline

  5. {

  6. 	font-size: 0px;

  7. 	position: absolute;

  8. 	background: white url('Jcrop.gif') top left repeat;

  9. }

  10. .jcrop-vline { height: 100%; width: 1px !important; }

  11. .jcrop-hline { width: 100%; height: 1px !important; }

  12. .jcrop-vline.right { right: 0px; }

  13. .jcrop-hline.bottom { bottom: 0px; }

  14. .jcrop-handle {

  15. 	font-size: 1px;

  16. 	width: 7px !important;

  17. 	height: 7px !important;

  18. 	border: 1px #eee solid;

  19. 	background-color: #333;

  20. }

  21. 

  22. .jcrop-tracker { width: 100%; height: 100%; }

  23. 

  24. .custom .jcrop-vline,

  25. .custom .jcrop-hline

  26. {

  27. 	background: yellow;

  28. }

  29. .custom .jcrop-handle

  30. {

  31. 	border-color: black;

  32. 	background-color: #C7BB00;

  33. 	-moz-border-radius: 3px;

  34. 	-webkit-border-radius: 3px;

  35. }

  36. 

  37. 

  38. /*over rides for normal cropping css*/

  39. body #image-crop-container{ background-color: transparent; }

  40. body #image-crop-container{ opacity:1;visibility:hidden; }