I have a parent div and inside that div is the gallery module, the gallery module is displaying only the caption over a white background and I am trying to pull with javascript the images from the slider and add them to the parent div so when the small gallery inside changes to the next slide so it does the parent background image.
From what I noticed, the gallery is loading after the dom is ready and my function of pulling the images returns undefined. I have tried many worksarounds but nothing has worked. Is there a specific function for when the gallery is loading?
You shouldn’t do what you are trying to do. It’s cool, and you can probably get it to work if you trigger the gallery js after the gallery loads, but there are easier ways.
The easiest and best way, in my opinion, is to use the new design manager’s custom module framework to build your own gallery, using your own code, creating a repeater group containing the elements you need for the gallery.
I’d imagine you don’t have the design manager beta yet since you are trying what you are trying, so the second best option (old school as I’m now calling it) is to use a custom HubL module, the hubl tag for a gallery, and set that tag to export to template context = true. You can now loop through the items in your gallery, customizing the markup to however you would like it.
The point is that customization = maximum control. don’t hack the system if you don’t have to.