Hello,
I'm building a tabbed component and I'm having trouble hiding the parsys section for inactive tabs using CSS styling (whether visibility or display). Even though I set the visibility of the parent DIV the parsys is sitting to hidden, it still displays on the page while in Edit mode (works in Preview).
<% String[] linkname = properties.get("navitems", String[].class); for (int i = 0; i < linkname.length; i++) { if (i == 0) { %><div class="miniShow" style="visibility: visible;"><% } else { %><div class="miniShow" style="visibility: hidden;"><% } %> <div class="<%= "basicMiniShow"+(i)%>"><cq:include path="<%= "mininav"+i %>" resourceType="foundation/components/parsys"/></div> </div> <% } // end for
%>
With the code above, as my JavaScript function properly swaps between tabs and shows the components in the parsys, the subsequent "Drag your components here" box doesn't disappear. For example, if I add 2 tabs and place a Button in the first parsys and a Image in the second, swapping tabs correctly shows/hides the button/image respectively - however the "Drag your components here" box for both are always visible.
What am I missing here?