This example shows how images are resized and cropped when the plugin is used with custom configuration. The red lines indicate the middle of the image and the blue dot is the focus point. Resize your window to see how much is cropped from the original images.

Original image resized by the browser

Resized by the browser

Resized with art direction (default crop ratio of 30%)

Resized with art direction (crop ratio 30%)

Resized with art direction (crop ratio 60%)

Resized with art direction (default crop ratio of 60%)

Resized with art direction (crop ratio 90%)

Resized with art direction (crop ratio 90%)

Original image resized by the browser

Resized by the browser

Resized with art direction (default crop ratio of 30%)

Resized with art direction (crop ratio 30%)

Resized with art direction (crop ratio 60%)

Resized with art direction (default crop ratio of 60%)

Resized with art direction (crop ratio 90%)

Resized with art direction (crop ratio 90%)