Just add one line.
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/salieo.min.js"></script>
No more pesky breakpoints.
Salieo uses cutting edge computer vision algorithms to identify the most important parts of your image. The best position and scale for your image is then calculated based on this data and the settings you've defined. Everything happens automatically and seamlessly - just include the Salieo JS library, add the salieo class to your image and load the page.
Save Development Time
No more manual work - Salieo automatically finds the best positioning and scaling for your image when displayed on any screen size with any pixel density.
After the first request for an image, the results of the image analysis are cached and distributed from our global CDN to ensure your images are positioned properly before they are rendered - resulting in no visual jitter.
Don't like how an image is positioned? No problem. Simply log in to your administration panel to customize the focus regions for your image with just a few clicks.
Intelligently avoid overlays ALPHA
Simply add the salieo-avoid class to any overlay and the subject of the image will be placed in the largest block of free space beside your overlay.
<div class="salieo" style="background: url('/img/car.jpg');">
<h1 class="salieo-avoid">Avoid this!</h1>