Give help. Get help.

  • Anonymous
    # June 12, 2013 at 10:08 pm

    I’m creating an image gallery and want to be able to add new images and perform the same actions which is revealing the full image. I want the user to simply add more image tiles and the full image on the HTML file and the function where the full photo is revealed is automatic with the jQuery and is applied to the newly added images without even touchig the jquery. Something that’s kinda like this where every tile has the same animation and when new tiles are added, the animation still applies to those.

    And here is what i’m trying to do with every image tile which is reveling the larger image that corresponds to the image tile clicked.

    # June 13, 2013 at 3:41 am

    You can make a global click listener like this:

    $(‘#gallery_section’).on(‘click’, ‘.gallery_content’, function() {
    // do stuff

    then you can add more content even after document load. I’d go with some easier way to parse the data you need, instead of _one, _two etc (for example use `data-src` attribute). You don’t need all the images in the `#image_container`, you can just change the src attribute.





    $(‘#gallery_section’).on(‘click’, ‘.gallery_content’, function() {
    $(‘#image_container > img’).attr(‘src’, $(this).data(‘src’));

    # June 13, 2013 at 10:57 am

    @CrocoDillon This is what i have exactly and it’s not working.


    $(‘#gallery_section’).on(‘click’, ‘.gallery_content’, function() {
    $(‘#image_container > img’).attr(‘src’, $(this).data(‘src’));

    $(“.gallery_content”).click(function() {

    Sorry but i’m having trouble showing the code. I updates the site with your code so you can see it there.

    # June 13, 2013 at 6:18 pm

    It works perfectly. thank you.

    # June 13, 2013 at 6:25 pm

    The `data-src` attributes need to be on the thumbnails. Check my previous comment HTML part.

    # June 13, 2013 at 9:07 pm

    @CrocoDillon Thanks i got it working. But can i also add youtube embed videos instead of the image for some panels?

    # June 14, 2013 at 6:12 am

    Uhmm… yeah maybe. Maybe go back to having all the images, videos, and what else already in your image_container and just use the index of the clicked element to show that index in the image_container. Alternatively:

    Wtf? Only works in FF -_-‘

    # June 14, 2013 at 6:28 am

    Trying something like:

    `var imageContainer = document.getElementById(‘image_container’);

    $(‘#gallery_section’).on(‘click’, ‘.gallery_content’, function() {
    if ($(this).data(‘type’) == ‘video’)
    imageContainer.innerHTML =
    imageContainer.innerHTML = ‘‘;

    which works for images but not for youtube vids…

    # June 14, 2013 at 7:27 am

    I need t have it work for videos too :P i thought that simply pasting the embed code in the image container frame would work.

    # June 14, 2013 at 8:01 am

    Yeah that’s what I did right? With the innerHTML stuff of the last comment.

    # June 14, 2013 at 12:11 pm

    I did that too but for some reason it’s not displaying

    # June 20, 2013 at 2:43 pm

    @CrocoDillon Is the a way to add text that goes along with the images being clicked and switch automatically when new ones are added along with their corresponding text using your code?

Viewing 12 posts - 1 through 12 (of 12 total)

You must be logged in to reply to this topic.