Disappearing Image Slider Content

try giving the target a class of maptastic like so:

[expand title="title" targclass="maptastic"]content with your slider[/expand]

Ahh, that’s way better. The slides are now appearing, however, when the slides load, they no longer sense the size of their container, so the image is too large, it is not scaled to fit, and the excess is hidden.

I could shrink the size of my images, but I like having images that show nicely on retina displays.

Thanks for your help.

btw, if I allow the page to load, and then make the browser window small and then back to its original size, the slide images resize themselves to the expected size.

This is a tricky issue indeed. The problem is as follows:

1. if you DO NOT use targclass="maptastic" then by the time your image slider is processed, the content area has a height of 0 (collapsed) and the responsive slider is not sure what to think about that. Thus creating your original issue.
2. if you DO use targclass="maptastic", then instead of ‘collapsing’ your content area, it simply moves it waaaay off the screen. Now when the responsive slider is processed, it has all kinds of space, and longer senses the size of the container, so the images are too large.

So where does that leave us? What we need to do, is wait until the slider has been inserted, figured out how much space it has to work with… resized everything and THEN collapse the container.

We’ll noodle on this a bit and see if there is not a way to tell collapse-o-matic to hold of on doing it’s thing until all other plugins have done theirs. In the mean time can you check and see if this fancy slider of yours has a callback? In other words the ability to call a function after it does it’s magic?

Thank you for the prompt and very clear response. It’s greatly appreciated.

I’ve written to the slider developer. He seems to be pretty responsive, so I will be sure to let you know if he has a callback function in his slider.

Again, thanks for your attention to my issue!

It’s the way we (try to) roll! We’ll get back to you in the next days with the results of our noodleing.

Hey there,

I’m having essentially the same issue.

I’m attempting to use a responsive jQuery slider inside a collapse-o-matic box. In responsive mode, the slider just didn’t show up — or rather the controls did but no images. I can hard-code in the size, but this kills the responsive-ness.

I read this thread and it all makes sense.

Was wondering if you’d come up with any ideas?

Thanks! (love love love the plugin)