1

I am using latest stable version of the Colorbox module

I have an image gallery with small thumbnails and a big one.

enter image description here

When I click on a small thumbnail it loads via Ajax a big image:

$commands[] = ajax_command_html(
    '.big-image', l(theme('image_style', array('style_name' => 'node-image', 'path' => 'public://' . $get_src)), file_create_url('public://' . $get_src), array('attributes' => array('class' => 'colorbox'), 'html' => TRUE))
  );

As you see i have added class .colorbox to a link, but it works only on the images that were loaded during the page load and it's not working on AJAX loaded images.

How can I re-initialize colorbox on Ajax images?

1

You need to attach your js using Drupal behaviors.

Drupal.behaviors.yourmodulename = {
  attach: function (context, settings) {
    // This code is run on page load and after every ajax request
    // attach colorbox functionality here... 
    // the following line should do the job but I've not tested it
    // we are using context so it only applies to the newly added objects
    $('.colorbox', context).colorbox();
  }
};

I found this blog post on the subject really useful.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.