guillotine
Version:
Allow users to crop images within an area (fully responsive). Supports dragging (touch support), zoom and rotation.
50 lines (45 loc) • 1.02 kB
CSS
body.guillotine-dragging, body.guillotine-dragging * {
cursor: move ;
cursor: -webkit-grabbing ;
cursor: -moz-grabbing ;
cursor: grabbing ;
cursor: grabbing, move; /* IE hack */
}
.guillotine-window {
display: block;
position: relative;
overflow: hidden;
cursor: move;
cursor: -webkit-grab;
cursor: -moz-grab;
cursor: grab;
cursor: grab, move; /* IE hack */
}
.guillotine-canvas {
position: absolute;
top: 0;
left: 0;
text-align: center;
margin: 0 ;
padding: 0 ;
border: none ;
}
.guillotine-canvas > * {
position: absolute;
top: 0;
left: 0;
max-width: none;
max-height: none;
width: 100%;
height: 100%;
margin: 0 ;
padding: 0 ;
border: none ;
}
.guillotine-sample {
position: absolute ;
top: -100000px ;
left: -100000px ;
width: auto ;
height: auto ;
}