• Resolved Abatap

    (@abatap)


    It seems that this plugin doesn’t work for elements that we receive through ajax request made with jQuerry. For example, I have a page with a list of products, the list is sometimes refreshed with data received from ajax request. Usually, in this situation when writing scripts jQuery you have to use delegates like this: $(“#some_parent_element_that_wraps_around_target_elements”).on(“click”, “.target_elements_to_handle_click_events_of”, function() { //code }); instead of handling click events for target elements direclty like this: $(“.target_elements_to_handle_click_events_of”).click(function() { //code }); because this won’t work for dynamically created DOM element.

    So my question is: How to make your plugin work in my situation? Or does the paid version of your plugin handle such situation corretly?

    https://ww.wp.xz.cn/plugins/easy-fancybox/

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi,

    Using delegate will make the script heavier (browser side) than needed on sites that do not use ajax. Which is most web sites at present. That will soon change with the upcoming WordPress REST API I’m sure but until then, I’m leaving the plugin at the current way of handling clicks.

    That said, there is one example of ajax loaded posts that does work with Easy FancyBox: Jetpack Infinite Scroll. This is because that script fires an event “post-load” right after each batch of posts have been added to the DOM tree. Easy FancyBox listens for “post-load” event and re-scans the new content to find and bind to new media links.

    Are your ajax routines home made? In that case, you should be able to add a simple trigger(‘post-load’) at the point where new content has been added and Easy FancyBox will start working for ajax loaded content.

    Hope theat helps 🙂

    Thread Starter Abatap

    (@abatap)

    Your solution worked. Thank you.

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Easy FancyBox and dynamically created DOM elements’ is closed to new replies.