Search code examples
typo3responsive-images

How to use focusArea in TYPO3 in the Frontend


Like in this example you can use a FocusArea in the Backend.

The result in the Frontend looks like this.

<img src="..." data-focus-area="{"x":4994,"y":2809,"width":4994,"height":2809}" />

What is needed in Frontend so that this focus-area is always visible?


Solution

  • I think there are jQuery libraries for it. I doesn't used this feature for now, but a quick look on this seems promising: jQuery Focuspoint

    Please note that this feature is only relevant if your space for the image is smaller than the image you want to show.