I have a grid of images that expand on click using a JQuery plugin I found on codepen.
See here: http://tenfold.webflow.io/expanding-grid – click on the images in the grid to show the expanded content.
Inside each of the expanding panels I have placed a webflow slider.
The trouble is that the expanded content panels need to have
display:none to hide them until a link is clicked to reveal the relevant panel. This causes the sliders to not load properly – the console gives this error: TypeError: undefined is not an object (evaluating ‘data.mask’)
I’ve found a few posts with a similar problem where the slider component needs ‘redrawing’ after being hidden.
@cyberdave – in other posts, you suggest this to redraw the slider:
Webflow.require('slider').redraw(); – however I’m not sure where to add this to my project to get it working for each of the sliders – would I have to initiate the redraw individually for each slider after each click of the grid links or is there a way I could redraw all at once? (also do I need to incorporate the redraw into the plugin itself?)
Any advice appreciated!