User:Codehydro/Auto CSS image crop: Difference between revisions

Content deleted Content added
New features: Click to crop and scale to desired width/height
mNo edit summary
Line 10:
Alternatively, you may simply copy the above line (or the contents of [[User:Codehydro/Auto CSS image crop/script.js|script.js]]) and execute it either in your URL bar, in the JavaScript console, or via a [[bookmarklet]] (just Google it).
 
== Quick Start Usage==
=== Quick Start ===
Enter the ''Image'' file (e.g. Dew on grass Luc Viatour.jpg) and a ''bSize'' value. Once both of these are entered press tab or click outside of the form and a preview of your image will automatically appear. Adjust cWidth/cHeight in the form to change how the image is cropped. Change oTop/oLeft or use the scroll bars to position your image. You may change the bSize and the script will resize the image while preserving the crop position. The source code will automatically be generated below the input.
 
Line 34 ⟶ 35:
}}</pre>
 
=== Advanced ===
* Press the up/down arrow keys to increase/decrease the field's value by 1% of bSize when in the cWidth, cHeight, oTop, and oLeft fields.
* Click opposite corners of the area you wish to frame and a guide lines will appear. Finalize crop using the "Crop to clicked" button.