image link to hive image link to ko-fi

Drupal 7 notes - making javascript work in a modal

posted on: Wednesday, 3 September 2014 @ 10:35pm in

Or more accurately in my case, making a jquery gallery work inside a modal. I am really bad at javascript so I have no idea if my hackjob is a good way to do anything but it did what I wanted.

What we needed in a recent project was for a gallery view with a thumbnail slider to launch from a gallery index comprising of thumbnails made up fo the first image in a multiupload image field. We used Gallery Formatter (the only one that would show up in the Colorbox Node at all).

Showing up was one thing, but the jquery magic wasn’t present in the modal. I got it to work by dropping the following into a file called script.js which lives in a /js folder in my theme.

(function($) { 
  $(document).ready(function() { 
    Drupal.behaviors.galleryformatter = { 
      attach: function (context) { 
        // We must wait for everything to load in order to get images' dimensions.
        $('#colorbox').one('mouseover', function() { 
          // rest of galleryformatter.js truncated for purposes of this blog post

I changed the function on the last line in the code block above from $(window).bind('load' ... which magically made everything work.