Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • June 26, 2025 at 3:52 pm #1485956
    transdesign_dk

    Hi Enfold Support,

    I’m experiencing a repeatable bug with the Enfold gallery — specifically when using image subtitles.

    On a page with an Enfold gallery, each image has been given a subtitle (via the built-in options). Everything works fine initially. However, after I scroll past the first image and then scroll back up to it, the subtitle is suddenly replaced with the string “null” on the frontend.

    This behavior suggests that the JavaScript responsible for handling image subtitles is not correctly preserving or restoring the subtitle data after the element is reloaded or redrawn (possibly due to lazy loading or Masonry reflow). It appears that the subtitle is being dynamically injected, but the value is lost or misread after scrolling, resulting in a “null” string being displayed instead.

    This only happens after interaction — when returning to the image — and seems like a client-side rendering issue.

    Could you please look into this? I’ve shared a few example pages in the private content. Thanks!

    Best regards,
    Martin

    June 27, 2025 at 7:42 am #1485994
    Ismael

    Hey Martin,

    Thank you for the inquiry.

    We noticed that the title attribute of the featured image is removed on mouse hover and returns on mouse out. Did you add a script that disables the title attribute on hover to prevent the default browser tooltip from showing? Please note that the lightbox script relies on the title attribute for the caption or image subtitle.

    You may need to remove the script that disables the title attribute to keep the lightbox subtitle or caption consistent. Let us know the result.

    Best regards,
    Ismael

    June 28, 2025 at 9:53 am #1486068
    Guenni007

    if it is a script like this:

    function temporary_removal_title_tags(){
?>
<script>
  window.onload = function() {
    var elementsWithTitle = document.querySelectorAll('a, img, *[title]');
    for (var i = 0; i < elementsWithTitle.length; i++) {
        var element = elementsWithTitle[i];

        element.setAttribute("data-original-title", element.title);

        element.addEventListener("mouseenter", function() {
            this.title = ""; 
        });

        element.addEventListener("mouseleave", function() {
            this.title = this.getAttribute("data-original-title"); 
        });

        element.addEventListener("mousedown", function() {
            this.title = this.getAttribute("data-original-title");
        });
    }
  };
</script>
<?php
}
add_action('wp_footer', 'temporary_removal_title_tags');

    then the mousedown (click) should bring the title back to the element. And lightbox had to show it.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.