It is possible that the position of the image source overlays shifts significantly. When this happens, it is often because the page shifts again after the position has already been established. This can be due to a script that loads later during page construction or when a user interacts with the site.
In the current case, posts, including post images, were listed on a website. This list could be dynamically filtered using an AJAX function. However, after filtering, the position of the image sources was no longer correct.
Depending on the cause and your own programming knowledge, there are the following solutions:
To correct the position of the image sources, you can execute the function
Depending on when the positions should be corrected, you can run the script with a delay or at a trigger. For example, if an AJAX filter is used to reposition post images, you must execute the mentioned function after the AJAX function has rebuilt the page. Whether this is possible, you may need to ask the developer of the function.
If this solution does not work, the rearrangement may have broken the markup. The CSS of Image Source Control requires the following selector to work:
.isc-source .isc-source-text. If one of them is missing, positioning no longer works.
It is also possible that the executed script overwrites the CSS of Image Source Control. We are happy to look at the exceptions in email support.
Custom CSS for Positioning
Activate the setting Overlay > Layout > Remove markup and style to prevent the automatic positioning and styling of overlays by Image Source Control.
You can now write your own CSS and markup. See the filter isc_overlay_html_source for this.
Prevent Page Shifts
The simplest “solution” is to prevent the page shifts or execute them below images. You may be able to do without an AJAX filter.
Is the appropriate solution not listed? Then contact our email support.