简体   繁体   中英

javascript lightbox2 - how to add class to the opened img?

I am having trouble with the lightbox2 plugin. I have an image who has class on it, and I want that the class will also be added when the image opened in lightbox.

is it possible?

<a href="fileUpload/uploads/<?php echo $picture['gallery_src']; ?>" data-lightbox=<?php echo '"image-'.$picture['gallery_id'].'"' ?>>
        <img src=<?php echo '"fileUpload/uploads/'.$picture['gallery_src'].'"';?> id="filter-target" style="width:600px;">
</a>

Here's a cleaned up version of your PHP. Remember to remove your duplicate IDs

echo '<a href="fileUpload/uploads/'.$picture['gallery_src'].'" data-lightbox="image-'.$picture['gallery_id'].'">';
echo '<img src="fileUpload/uploads/'.$picture['gallery_src'].'" id="filter-target" style="width:600px;">';
echo '</a>';

You can add classes and data attributes to the image being viewed by running the following code:

$('body').on('click', 'a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]', function(e) {

  $('#lightbox .lb-image')
    .addClass('filter-blur')
    .data('pb-blur-amount', 5);
});

Here's a demo

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM