Plugin doesn't recognise inserted HREFs

  • Resolved Max

    (@beechboy707)


    8 years, 4 months ago

    Hello there!

    Firstly beautiful plugin – thank you!

    Though I have an issue that if I insert the URL into an HREF tag via Javascript when the document is ready, the plugin doesn’t recognise the image and so ignores the link. You can see this here, under the Gallery section: https://pitfarmtennis.co.uk/home-test/.
    The first 68 images work fine, as their links are already there, but if you click view more images, those images have had their links inserted via javascript, as shown below, and so the plugin doesn’t seem to recognise them. Is there any way aroudn this please?

    Very many thanks

    <script type=”text/javascript”>
    jQuery(document).ready(function($) {
    <?php $imagesids2 = array_slice($imagesids, 8); ?>
    var images = [ <?php foreach( $imagesids as $imageid2 ): echo “‘” . wp_get_attachment_image_src( $imageid2, $size=’large’ )[0] . “‘, “; endforeach; ?> ];
    $(“.viewfullalbum<?php echo $albumcount; ?>”).click(function() {
    $(‘.gallery-album-contents-<?php echo $albumcount; ?> .gallery-photo’).each(function(i, obj) {
    $(obj).css(“background-image”, “url(“+images[i]+”)”);
    $(obj).parents().eq(1).attr(“href”, images[i]);
    });

    $(“.gallery-album-contents-<?php echo $albumcount; ?> .gallery-photo-container-parent”).css(“display”, “inline”);
    $(“.viewfullalbum<?php echo $albumcount; ?>”).css(“display”, “none”);
    });
    });
    </script>
    <?php $imagesids2 = array_slice($imagesids, 8); ?>
    <?php foreach( $imagesids2 as $imageid2 ): ?>
    <div class=”gallery-photo-container-parent” style=”display: none;”>
    “> <!– Javascript inserts href=”…” here –>
    <div class=”gallery-photo-container”>
    <div class=”gallery-photo”></div><!– Javascript inserts style=”background-image: url(”)” here –>
    </div>

    </div>
    <?php endforeach; ?>

    https://www.ads-software.com/plugins/wp-featherlight/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Robert Neu

    (@fatmedia)

    Hey Beechboy,

    This is a little bit outside of the scope of things that we’re able to provide support for, but I think what you’re going to need to do is re-fire featherlight on ajaxComplete

    Something along these lines is probably what you’ll need to do in order to have those new DOM elements recognized: https://stackoverflow.com/a/14692528

    You could also try modifying the HTML in that gallery to include the featherlight data attributes within them. I’m not sure if featherlight will recognize the added DOM elements or not because I haven’t tried it myself or dug through the code deep enough to say whether it’s watching for DOM changes, but it’s worth a shot.

    Hope that’s helpful!

    – Rob

    Thread Starter Max

    (@beechboy707)

    Hi Robert,

    Very many thanks for the amazingly fast and helpful response!
    You are quite right, adding data-featherlight=”image” to the a tag has done the trick – thank you so much!

    I will be sure to leave a great review!

    All the best.

    Plugin Author Robert Neu

    (@fatmedia)

    Awesome! I’m glad that did the trick. I’ll make a note that it does in fact watch the DOM for new elements in the event that someone runs into a similar issue in the future. ??

    Thread Starter Max

    (@beechboy707)

    Great! You’re even more clever than you think!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Plugin doesn't recognise inserted HREFs’ is closed to new replies.